@controladordefinancas/ds-token

@common-machine/ds-token

Install

# pnpm
pnpm i -D @controladordefinancas/ds-token

# npm
npm i -D @controladordefinancas/ds-token

# Yarn
yarn add -D @controladordefinancas/ds-token

Usage

MUI

Import tokens to MUI create theme.

import { lightTheme } from '@controladordefinancas/ds-token/src/theme/mui/light'
import { darkTheme } from '@controladordefinancas/ds-token/src/theme/mui/dark'

CSS

@import '@controladordefinancas/ds-token/build/tokens/css/light.css';
@import '@controladordefinancas/ds-token/build/tokens/css/dark.css';
/* or with @media prefers color schema */
@import '@controladordefinancas/ds-token/build/tokens/css/theme.css';

JS

Is possible to use via json with values of type css var or fixed values.

import { ds as var } from '@controladordefinancas/ds-token/build/tokens/js/variables.json'
import { ds as value } from '@controladordefinancas/ds-token/src/tokens/mui.json'

var.palette.common.black.value // --ds-palette-common-black
value.palette.common.black.value // #000000

License

MIT License