| Title | Value on light | Value on dark |
|---|---|---|
| color.background.primary | ||
| color.background.secondary | ||
| color.background.tertiary | ||
| color.background.accent | ||
| color.background.attention | ||
| color.background.success | ||
| color.background.disabled | ||
| color.background.elevated | ||
| color.background.secondaryOnElevated | ||
| color.background.onSecondary | ||
| color.background.inverse | ||
| color.background.strong | ||
| color.background.education | ||
| color.background.onImage | ||
| color.background.transparent |
| Title | Value on light | Value on dark |
|---|---|---|
| color.foreground.primary | ||
| color.foreground.secondary | ||
| color.foreground.disabled | ||
| color.foreground.accent | ||
| color.foreground.attention | ||
| color.foreground.success | ||
| color.foreground.onAccent | ||
| color.foreground.onAttention | ||
| color.foreground.onSuccess | ||
| color.foreground.onInverse | ||
| color.foreground.onStrong | ||
| color.foreground.onDisabled | ||
| color.foreground.link.visited | ||
| color.foreground.link.legal | ||
| color.foreground.link.primary |
| Title | Value on light | Value on dark |
|---|---|---|
| color.border.strong | ||
| color.border.medium | ||
| color.border.subtle | ||
| color.border.accent | ||
| color.border.attention | ||
| color.border.success | ||
| color.border.inverse | ||
| color.border.onAccent | ||
| color.border.onAttention | ||
| color.border.onSuccess | ||
| color.border.onInverse | ||
| color.border.onDisabled | ||
| color.border.disabled |
| Title | Value on light | Value on dark |
|---|---|---|
| color.stateLayer.hover | ||
| color.stateLayer.hoverOnStrong | ||
| color.stateLayer.pressed | ||
| color.stateLayer.pressedOnStrong | ||
| color.stateLayer.selected | ||
| color.stateLayer.selectedOnStrong | ||
| color.stateLayer.focus | ||
| color.stateLayer.focusOnStrong |
| Title | Value on light | Value on dark |
|---|---|---|
| color.scrim.background |
| Title | Value on light | Value on dark |
|---|---|---|
| color.loading.onPrimary.state.1 | ||
| color.loading.onPrimary.state.2 | ||
| color.loading.onSecondary.state.1 | ||
| color.loading.onSecondary.state.2 |
| Title | Value on light | Value on dark |
|---|---|---|
| color.ai.solid.red.strong | ||
| color.ai.solid.red.subtle | ||
| color.ai.solid.yellow.strong | ||
| color.ai.solid.purple.strong | ||
| color.ai.solid.purple.subtle | ||
| color.ai.solid.blue.strong | ||
| color.ai.solid.blue.subtle | ||
| color.ai.solid.green.strong | ||
| color.ai.solid.green.subtle |
| Title | Value on light | Value on dark |
|---|---|---|
| color.gradient.imageScrim | - | - |
| color.gradient.ai.fullColorDiagonal | ||
| color.gradient.ai.green.strong | ||
| color.gradient.ai.green.subtle | ||
| color.gradient.ai.blue.strong | ||
| color.gradient.ai.blue.subtle | ||
| color.gradient.ai.purple.strong | ||
| color.gradient.ai.purple.subtle |
| Title | Background | Foreground |
|---|---|---|
| Title | Value |
|---|---|
| Title | Value |
|---|---|