Color

Shape-style modifiers accept hex, light/dark, and semantic colors.

import { Color, Modifier, Text } from "onescript/views"

<Text
  modifier={Modifier
    .foregroundStyle(Color.primary)
    .background(Color.systemGray6)}
>
  Adaptive color
</Text>

Custom colors use six-digit RGB or eight-digit ARGB hex values:

Modifier.background("#F2F2F7")
Modifier.background({ light: "#FFFFFF", dark: "#1C1C1E" })

Available semantic values include primary, secondary, accentColor, clear, standard named colors, systemGray through systemGray6, and the three system background levels. Semantic colors automatically follow the current system appearance.