🚨 WarningUntil we reach v1.0.0 the API still may change.
Get Started
yarn add tonami
Documentation
Example
import { createTokens, styled, createGlobalStyle } from "tonami";
const theme = createTokens({
fontFamily: "Helvetica",
borderRadius: "3px",
});
const Global = createGlobalStyle({
html: {
fontFamily: theme.fontFamily,
},
});
const Banner = styled.div({
borderRadius: theme.borderRadius,
backgroundColor: ({ $color }) => $color,
});
const { Tokens } = theme;
function App() {
return (
<>
<Tokens />
<Global />
<Banner $color="lightgreen">Welcome!</Banner>
</>
);
}
Issues
Please file an issue for bugs or unexpected behavior.
Feature Requests
Please file an issue to suggest new features. Vote on feature requests by adding a
License
MIT