# clockface

**Repository Path**: mirrors_influxdata/clockface

## Basic Information

- **Project Name**: clockface
- **Description**: UI Kit for building Chronograf
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-08-08
- **Last Updated**: 2025-09-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Clockface

[![npm version](https://badge.fury.io/js/%40influxdata%2Fclockface.svg)](https://badge.fury.io/js/%40influxdata%2Fclockface)

A React + Typescript UI Kit for building Chronograf and other Time Series visualization applications.

### [Documentation](https://influxdata.github.io/clockface)

### [Changelog](https://github.com/influxdata/clockface/blob/master/CHANGELOG.md)

### [Publishing Guide](https://github.com/influxdata/clockface/blob/master/PUBLISHING.md)

### [Contributing Guide](https://github.com/influxdata/clockface/blob/master/CONTRIBUTING.md)

### [Icon Font Guide](https://github.com/influxdata/clockface/blob/master/ICONFONT.md)

### [Testing a Build Locally](https://github.com/influxdata/monitor-ci#how-to-test-clockface-and-giraffe-changes-locally)

### Usage

```
npm install @influxdata/clockface

yarn add @influxdata/clockface
```
Import the Clockface stylesheet to your React app's `index.jsx` file
```tsx
import '@influxdata/clockface/dist/index.css'
```