import { Meta } from "@storybook/addon-docs";

import { fonts } from "tokens";

import { TokensGrid } from "../../components/TokensGrid";

<Meta title="Tokens/Font Families" />

[![Font Families Tokens](https://raw.githubusercontent.com/showC0de-proFile/logos/main/label-font-families.svg)](https://raw.githubusercontent.com/showC0de-proFile/logos/main/label-font-families.svg)

# Font Families

Font families are a fundamental element of typography that contribute to the overall aesthetic and personality of your user interface. The ds-tsm Design System provides a collection of predefined font families that can be easily applied to your project, ensuring consistent and cohesive typography.

<TokensGrid tokens={fonts} />