No edit summary |
No edit summary |
||
Line 1: | Line 1: | ||
== Accent Colors == | |||
<div style="color:white;"> | <div style="color:white;"> | ||
<div style="background-color:var(--color-primary); width:100px; height:100px">Primary</div> | <div style="background-color:var(--color-primary); width:100px; height:100px">Primary</div> | ||
Line 5: | Line 7: | ||
<div style="background-color:var(--color-success); width:100px; height:100px">Success</div> | <div style="background-color:var(--color-success); width:100px; height:100px">Success</div> | ||
<div style="background-color:var(--color-warning); width:100px; height:100px">Warning</div> | <div style="background-color:var(--color-warning); width:100px; height:100px">Warning</div> | ||
</div> | |||
== Background Colors == | |||
Never use Surface 0, that's reserved for the page background color ONLY. | |||
<div style="color:white;"> | |||
<div style="background-color:var(--color-surface-0); width:100px; height:100px">Surface 0</div> | <div style="background-color:var(--color-surface-0); width:100px; height:100px">Surface 0</div> | ||
<div style="background-color:var(--color-surface-1); width:100px; height:100px">Surface 1</div> | <div style="background-color:var(--color-surface-1); width:100px; height:100px">Surface 1</div> |
Revision as of 04:34, 14 January 2024
Accent Colors
Primary
Destructive
Success
Warning
Background Colors
Never use Surface 0, that's reserved for the page background color ONLY.
Surface 0
Surface 1
Surface 2
Surface 3
Surface 4