@sandlada/mdk
Version:
A JavaScript library based on Material Design 3, providing data such as color, shape, shadow level, etc.
62 lines (61 loc) • 5.94 kB
JavaScript
export const DefaultColorContract = {
PrimaryKeyColor: { Key: `--md-sys-color-primary-key-color`, Value: `#039d54` },
SecondaryKeyColor: { Key: `--md-sys-color-secondary-key-color`, Value: `#54815f` },
TertiaryKeyColor: { Key: `--md-sys-color-tertiary-key-color`, Value: `#ffa97f` },
ErrorKeyColor: { Key: `--md-sys-color-error-key-color`, Value: `#de3730` },
NeutralKeyColor: { Key: `--md-sys-color-neutral-key-color`, Value: `#727971` },
NeutralVariantKeyColor: { Key: `--md-sys-color-neutral-variant-key-color`, Value: `#6d7a6e` },
Background: { Key: `--md-sys-color-background`, Value: `light-dark(#f4fbf1, #0e150f)` },
Error: { Key: `--md-sys-color-error`, Value: `light-dark(#ba1a1a, #ffb4ab)` },
ErrorContainer: { Key: `--md-sys-color-error-container`, Value: `light-dark(#ffdad6, #93000a)` },
ErrorDim: { Key: `--md-sys-color-error-dim`, Value: `light-dark(#a80710, #ff554a)` },
InverseOnSurface: { Key: `--md-sys-color-inverse-on-surface`, Value: `light-dark(#ecf3e9, #2b322c)` },
InversePrimary: { Key: `--md-sys-color-inverse-primary`, Value: `light-dark(#61de8c, #006d38)` },
InverseSurface: { Key: `--md-sys-color-inverse-surface`, Value: `light-dark(#2b322c, #dde4db)` },
OnBackground: { Key: `--md-sys-color-on-background`, Value: `light-dark(#171d17, #dde4db)` },
OnError: { Key: `--md-sys-color-on-error`, Value: `light-dark(#ffffff, #690005)` },
OnErrorContainer: { Key: `--md-sys-color-on-error-container`, Value: `light-dark(#93000a, #ffdad6)` },
OnPrimary: { Key: `--md-sys-color-on-primary`, Value: `light-dark(#ffffff, #00391a)` },
OnPrimaryContainer: { Key: `--md-sys-color-on-primary-container`, Value: `light-dark(#00592c, #00592c)` },
OnPrimaryFixed: { Key: `--md-sys-color-on-primary-fixed`, Value: `light-dark(#00210d, #00210d)` },
OnPrimaryFixedVariant: { Key: `--md-sys-color-on-primary-fixed-variant`, Value: `light-dark(#005229, #005229)` },
OnSecondary: { Key: `--md-sys-color-on-secondary`, Value: `light-dark(#ffffff, #0a381c)` },
OnSecondaryContainer: { Key: `--md-sys-color-on-secondary-container`, Value: `light-dark(#406c4b, #97c7a0)` },
OnSecondaryFixed: { Key: `--md-sys-color-on-secondary-fixed`, Value: `light-dark(#00210d, #00210d)` },
OnSecondaryFixedVariant: { Key: `--md-sys-color-on-secondary-fixed-variant`, Value: `light-dark(#244f31, #244f31)` },
OnSurface: { Key: `--md-sys-color-on-surface`, Value: `light-dark(#171d17, #dde4db)` },
OnSurfaceVariant: { Key: `--md-sys-color-on-surface-variant`, Value: `light-dark(#3d4a3f, #bccabc)` },
OnTertiary: { Key: `--md-sys-color-on-tertiary`, Value: `light-dark(#ffffff, #552002)` },
OnTertiaryContainer: { Key: `--md-sys-color-on-tertiary-container`, Value: `light-dark(#793c1a, #793c1a)` },
OnTertiaryFixed: { Key: `--md-sys-color-on-tertiary-fixed`, Value: `light-dark(#351000, #351000)` },
OnTertiaryFixedVariant: { Key: `--md-sys-color-on-tertiary-fixed-variant`, Value: `light-dark(#723615, #723615)` },
Outline: { Key: `--md-sys-color-outline`, Value: `light-dark(#6d7a6e, #879487)` },
OutlineVariant: { Key: `--md-sys-color-outline-variant`, Value: `light-dark(#bccabc, #3d4a3f)` },
Primary: { Key: `--md-sys-color-primary`, Value: `light-dark(#006d38, #76f29e)` },
PrimaryContainer: { Key: `--md-sys-color-primary-container`, Value: `light-dark(#58d584, #58d584)` },
PrimaryDim: { Key: `--md-sys-color-primary-dim`, Value: `light-dark(#006030, #82fea8)` },
PrimaryFixed: { Key: `--md-sys-color-primary-fixed`, Value: `light-dark(#7ffba6, #7ffba6)` },
PrimaryFixedDim: { Key: `--md-sys-color-primary-fixed-dim`, Value: `light-dark(#61de8c, #61de8c)` },
Scrim: { Key: `--md-sys-color-scrim`, Value: `light-dark(#000000, #000000)` },
Secondary: { Key: `--md-sys-color-secondary`, Value: `light-dark(#3c6847, #a2d2ab)` },
SecondaryContainer: { Key: `--md-sys-color-secondary-container`, Value: `light-dark(#bbecc3, #295436)` },
SecondaryDim: { Key: `--md-sys-color-secondary-dim`, Value: `light-dark(#305b3c, #bdeec5)` },
SecondaryFixed: { Key: `--md-sys-color-secondary-fixed`, Value: `light-dark(#bdeec5, #bdeec5)` },
SecondaryFixedDim: { Key: `--md-sys-color-secondary-fixed-dim`, Value: `light-dark(#a2d2ab, #a2d2ab)` },
Shadow: { Key: `--md-sys-color-shadow`, Value: `light-dark(#000000, #000000)` },
Surface: { Key: `--md-sys-color-surface`, Value: `light-dark(#f4fbf1, #0e150f)` },
SurfaceBright: { Key: `--md-sys-color-surface-bright`, Value: `light-dark(#f4fbf1, #343b34)` },
SurfaceContainer: { Key: `--md-sys-color-surface-container`, Value: `light-dark(#e9f0e6, #1b211b)` },
SurfaceContainerHigh: { Key: `--md-sys-color-surface-container-high`, Value: `light-dark(#e3eae1, #252c25)` },
SurfaceContainerHighest: { Key: `--md-sys-color-surface-container-highest`, Value: `light-dark(#dde4db, #303630)` },
SurfaceContainerLow: { Key: `--md-sys-color-surface-container-low`, Value: `light-dark(#eff6ec, #171d17)` },
SurfaceContainerLowest: { Key: `--md-sys-color-surface-container-lowest`, Value: `light-dark(#ffffff, #09100a)` },
SurfaceDim: { Key: `--md-sys-color-surface-dim`, Value: `light-dark(#d5dcd3, #0e150f)` },
SurfaceTint: { Key: `--md-sys-color-surface-tint`, Value: `light-dark(#006d38, #61de8c)` },
SurfaceVariant: { Key: `--md-sys-color-surface-variant`, Value: `light-dark(#d8e6d7, #3d4a3f)` },
Tertiary: { Key: `--md-sys-color-tertiary`, Value: `light-dark(#8f4d2a, #ffcfba)` },
TertiaryContainer: { Key: `--md-sys-color-tertiary-container`, Value: `light-dark(#ffa97f, #ffa97f)` },
TertiaryDim: { Key: `--md-sys-color-tertiary-dim`, Value: `light-dark(#804120, #fda77d)` },
TertiaryFixed: { Key: `--md-sys-color-tertiary-fixed`, Value: `light-dark(#ffdbcc, #ffdbcc)` },
TertiaryFixedDim: { Key: `--md-sys-color-tertiary-fixed-dim`, Value: `light-dark(#ffb693, #ffb693)` },
};