open-index/open-npm huggingface dataset:
npm package: @kapeta/style
Description: Variables and styles for Kapeta Design System
Latest version: 0.98.0

# Kapeta design system

Converts `tokens.json` from Figma token studio into tokens for Material UI v5.

Uses [`token-transformer`](https://github.com/tokens-studio/figma-plugin/tree/main/token-transformer)
to create a light and a dark theme:

-   `tokens.json` -> `tokens/dark.json`
-   `tokens.json` -> `tokens/light.json`

Then uses [style-dictionary](https://github.com/amzn/style-dictionary) to convert the light and dark tokens
into a format that works with different platforms. Currently the following are supported:

-   Material UI v5 ([@mui/material@5](https://github.com/mui/material-ui))

## Usage

### Material UI

```tsx
import { lightTheme, darkTheme } from '@kapeta/styles/themes/mui';
import { createTheme } from '@mui/material/styles';

const theme = createTheme(lightTheme);

export const ThemedApp = () => (
    <ThemeProvider theme={theme}>
        <App />
    </ThemeProvider>
);
```