0.0.7 • Published 7 years ago
react-circle-clock v0.0.7
react-circle-clock
React circle clock component
Installation
$ npm install react-circle-clock --saveDEMO
Displays 2 circle SVGs with customizable radius and stroke. One circle is in the background and one circle keeps animating by time - ticks in each second.

The clock can overlap, it won't start from the begining, but continue ticking by inverting the colors.

Usage
import React from 'react';
import CircleClock from 'react-circle-clock';
class Dashboard extends React.Component{
render() {
return (
<div>
<CircleClock />
</div>
)
}
}Components
CircleClock
Props
| Name | Type | Default | Description | |
|---|---|---|---|---|
| radius | number | 65 | ||
| size | number | 150 | ||
| primaryColor | string | '#00ADB5' | ||
| secondaryColor | string | '#F4AB63' | ||
| customFontSize | string | '24px' | ||
| stroke | string | '10' | ||
| strokeBack | string | '10' | ||
| strokeFront | string | '10' |
License
This software is released under the MIT License.