# Foundations tokens

Umia DS design tokens exported from the Umia Foundations Figma file.

## Pages

- [Colors](./colors.md)
- [Radius and size](./radius-and-size.md)
- [Spacing](./spacing.md)
- [Typography](./typography.md)
- [Elevation](./elevation.md)
- [Layout](./layout.md)

## Gotchas

1. Umia DS sets every token on `:root`; `.dark` (or `[data-theme="dark"]`) on `<html>` switches to the dark values, and `[data-umia-direction="color-blind"]` swaps positive and negative.
2. Apps that merge classes with `cn()` (tailwind-merge) must add `textStyleUtilities` from `@umia/design/text-styles` to the font-size group (`extendTailwindMerge({ extend: { theme: { text: [...] } } })`), or `cn("text-heading-md text-muted-foreground")` drops `text-heading-md`. The hub does this in `web/hub/lib/utils.ts`.
3. `shadow-<color>` modifiers do not recolour Umia DS shadows.