GuidesComponentsTheme

Colors

Default MD3 and healthcare color tokens exported by the SDK

  • Stable unknown
  • Release candidate since 1.16.1-rc.3
  • Development since 1.16.1-dev.2111+9796905

DEFAULT_COLORS is a typed starting palette for ThemeProvider. It contains Paper-compatible MD3 color tokens plus success, error, warning, and the extended gray, blue, purple, pink, cyan, green, red, orange, and yellow palettes.

import { DEFAULT_COLORS, ThemeProvider } from "@ovok/native";

<ThemeProvider
  theme={{
    colors: { ...DEFAULT_COLORS, primary: "#2563eb" },
    dark: false,
    spacingMultiplier: 4,
    borderRadiusMultiplier: 4,
  }}
>
  <App />
</ThemeProvider>;

Palette shape

The normal palette keys are 25, 50, and 100 through 1000. gray also contains the optional 1100 shade. Do not document a 1100 shade for the other families unless the type and runtime palette gain it.

Semantic colors are plain strings. The SDK does not compute accessible foreground colors when a semantic or brand color is overridden. Pair custom backgrounds with an explicitly tested on* color and verify light and dark themes.

Extending the palette

Use object spread so unrelated MD3 tokens and shades remain available:

const colors = {
  ...DEFAULT_COLORS,
  primary: "#0f766e",
  blue: { ...DEFAULT_COLORS.blue, 700: "#0f766e" },
};

DEFAULT_COLORS is not a runtime contrast engine or a clinical interpretation layer. Status meaning and thresholds remain application-owned.

Last updated on

On this page