diff --git a/docs/style-guide.md b/docs/style-guide.md index a69003a..09a0dd5 100644 --- a/docs/style-guide.md +++ b/docs/style-guide.md @@ -13,7 +13,228 @@ These are general use cases for most of the palette relevant for user interfaces. The `function` expresses a very vague use-case of a color and the `scope example` is how it is generally used: - +
Background Colours |
+ ||||||
---|---|---|---|---|---|---|
Function | +Examples | +Colours | +||||
Backgroun Pane | +Main Canvas, Page Background | +Base | ++ + | ++ + | ++ + | ++ + | +
Secondary Panes | +Secondary Canvases, Content Boxes, Sidebars | +
+ Crust, + Mantle + |
+
+ + + |
+
+ + + |
+
+ + + |
+
+ + + |
+
Surface Elements | +Sign Columns, Cursor Line, Generic Buttons, Inputs | +
+ Surface 0, + Surface 1, + Surface 2 + |
+
+ + + + |
+
+ + + + |
+
+ + + + |
+
+ + + + |
+
Overlays | +Splits, Floating Elements | +
+ Overlay 0, + Overlay 1, + Overlay 2 + |
+
+ + + + |
+
+ + + + |
+
+ + + + |
+
+ + + + |
+
Typography |
+ ||||||
Function | +Examples | +Colours | +||||
Foreground | +Main Text, Body Copy | +Text | ++ + | ++ + | ++ + | ++ + | +
Subtext | +Secondary Text, Headlines, Labels | +
+ Subtext 0, + Subtext 1 + |
+
+ + + |
+
+ + + |
+
+ + + |
+
+ + + |
+
Subtle | +Comments, Footnotes, Inactive Text | +Overlay 1 | ++ + | ++ + | ++ + | ++ + | +
Highlights | +
+ Links, URLs + Success + Warnings + Errors + Search Results, Tags + |
+
+ Rosewater + Green + Peach + Maroon + Blue + |
+
+ + + + + + |
+
+ + + + + + |
+
+ + + + + + |
+
+ + + + + + |
+