Token catalog
Semantic tokens resolved from tokens/catalog.json. Light and dark values are already dereferenced from primitives.
| Id | CSS | Swift | Compose | Light | Dark |
|---|---|---|---|---|---|
| color.canvas | --felicityui-color-canvas | DesignColor.canvas | DesignColors.canvas | #F7F4EF | #12100E |
| color.surface | --felicityui-color-surface | DesignColor.surface | DesignColors.surface | #FFFFFF | #1A1814 |
| color.muted | --felicityui-color-muted | DesignColor.muted | DesignColors.muted | #EFEBE3 | #2C2721 |
| color.fg.default | --felicityui-color-fg-default | DesignColor.fgDefault | DesignColors.fgDefault | #1A1814 | #F7F4EF |
| color.fg.muted | --felicityui-color-fg-muted | DesignColor.fgMuted | DesignColors.fgMuted | #5C5243 | #C4B9A6 |
| color.fg.subtle | --felicityui-color-fg-subtle | DesignColor.fgSubtle | DesignColors.fgSubtle | #9C8E78 | #7A6D58 |
| color.fg.inverse | --felicityui-color-fg-inverse | DesignColor.fgInverse | DesignColors.fgInverse | #F7F4EF | #1A1814 |
| color.border.default | --felicityui-color-border-default | DesignColor.borderDefault | DesignColors.borderDefault | #DDD6C8 | #433C32 |
| color.border.strong | --felicityui-color-border-strong | DesignColor.borderStrong | DesignColors.borderStrong | #1A1814 | #F7F4EF |
| color.action.primary | --felicityui-color-action-primary | DesignColor.actionPrimary | DesignColors.actionPrimary | #9A3F1F | #C97B47 |
| color.action.primary-foreground | --felicityui-color-action-primary-foreground | DesignColor.actionPrimaryForeground | DesignColors.actionPrimaryForeground | #F7F4EF | #12100E |
| color.action.secondary | --felicityui-color-action-secondary | DesignColor.actionSecondary | DesignColors.actionSecondary | #1A1814 | #F7F4EF |
| color.action.secondary-foreground | --felicityui-color-action-secondary-foreground | DesignColor.actionSecondaryForeground | DesignColors.actionSecondaryForeground | #F7F4EF | #1A1814 |
| color.action.ghost | --felicityui-color-action-ghost | DesignColor.actionGhost | DesignColors.actionGhost | #1A1814 | #F7F4EF |
| color.danger.default | --felicityui-color-danger-default | DesignColor.dangerDefault | DesignColors.dangerDefault | #A32D2D | #C43C3C |
| color.danger.foreground | --felicityui-color-danger-foreground | DesignColor.dangerForeground | DesignColors.dangerForeground | #FFFFFF | #FFFFFF |
| color.focus.ring | --felicityui-color-focus-ring | DesignColor.focusRing | DesignColors.focusRing | #B4532A | #D9A074 |
| space.control-x | --felicityui-space-control-x | DesignColor.spaceControlX | DesignColors.spaceControlX | 16px | 16px |
| space.control-y | --felicityui-space-control-y | DesignColor.spaceControlY | DesignColors.spaceControlY | 8px | 8px |
| size.control.sm | --felicityui-size-control-sm | DesignColor.sizeControlSm | DesignColors.sizeControlSm | 32px | 32px |
| size.control.md | --felicityui-size-control-md | DesignColor.sizeControlMd | DesignColors.sizeControlMd | 40px | 40px |
| size.control.lg | --felicityui-size-control-lg | DesignColor.sizeControlLg | DesignColors.sizeControlLg | 48px | 48px |
| radius.control | --felicityui-radius-control | DesignColor.radiusControl | DesignColors.radiusControl | 8px | 8px |
| borderWidth.control | --felicityui-borderWidth-control | DesignColor.borderWidthControl | DesignColors.borderWidthControl | 1px | 1px |
| motion.control | --felicityui-motion-control | DesignColor.motionControl | DesignColors.motionControl | 120ms | 120ms |
| opacity.disabled | --felicityui-opacity-disabled | DesignColor.opacityDisabled | DesignColors.opacityDisabled | 0.45 | 0.45 |
| opacity.overlay | --felicityui-opacity-overlay | DesignColor.opacityOverlay | DesignColors.opacityOverlay | 0.56 | 0.56 |
| elevation.raised | --felicityui-elevation-raised | DesignColor.elevationRaised | DesignColors.elevationRaised | 1 | 1 |
| zIndex.overlay | --felicityui-zIndex-overlay | DesignColor.zIndexOverlay | DesignColors.zIndexOverlay | 40 | 40 |
| typography.control.size | --felicityui-typography-control-size | DesignColor.typographyControlSize | DesignColors.typographyControlSize | 14px | 14px |
| typography.control.weight | --felicityui-typography-control-weight | DesignColor.typographyControlWeight | DesignColors.typographyControlWeight | 500 | 500 |