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

import { fontSizes } from "tokens";

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

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

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

# Font Sizes

Font sizes play a crucial role in defining the visual hierarchy and readability of text within your user interface. The ds-tsm Design System provides a set of predefined font sizes that can be easily applied to your project, ensuring consistency and harmonious typography.

<TokensGrid tokens={fontSizes} hasRemValue />