Install and setup @founfation-ui/tokens 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.
To get the most out of @foundation-ui/tokens, it is strongly recommended to
use it with @foundation-ui/components.
pnpm add @foundation-ui/tokens@foundation-ui/tokens comes with large built-in libraries of Design Tokens,
you'll find colors, font-sizes, spacings, opacities and depths definitions.
Each design token come with a key-value and a set of annotations that you can
use in your application.
If you want to create custom library, @foundation-ui/core provides a set of
methods enabling you to do so.
Design tokens offer several benefits over traditional design approaches:
Design tokens ensure that all UI elements have a consistent look and feel across different platforms and devices.
Design tokens can be easily updated and extended to accommodate new design requirements, making it easier to scale a design system.
Design tokens reduce the need for manual coding and enable developers to quickly implement design changes.
Design tokens can be used to create accessible designs by defining appropriate color contrast ratios, font sizes, and other accessibility-related properties.