Install and setup @founfation-ui/core in your project.
If you want to install @foundation-ui packages, you can either fork the repository or join the community to get an installation token during the Beta program.
@foundation-ui/core
can be used to dynamically generate design tokens on
build-time or every time your library needs an update. use it with
@foundation-ui/components
.
Your can use usefui.dev's Token Engine to generate new design token libraries whenever you need.
pnpm add @foundation-ui/core
@foundation-ui/core
comes with a set of methods built to generate a
stuctured Design Tokens based on a few parameters. Each design token come with
a key-value and a set of annotations that you can use in your application.
A specific a set of ratio is used to generate FontSizes/Measurement Design Tokens. It is based on this documentation from Scott Kellum and Tim Brown.
enum RatioEnum {
MinorSecond = 16 / 15,
MajorSecond = 9 / 8,
MinorThird = 6 / 5,
MajorThird = 5 / 4,
PerfectFourth = 4 / 3,
PerfectFifth = 3 / 2,
GoldenRatio = 1.618 / 1,
}