I wanted to create base16 and base24 themes for Niri (a wayland compositor), and I realised that styling.md doesn't offer any advice about how to use the colours in that situation. So I took a step back to create a more abstract view (independent of the application) of how the colours are typically used. Once I had done that, I could logically extend the style guide to cover display managers, compositors, and other kinds of elements.
If this is of any interest, I could polish it up and create a pull request to include it (perhaps in styling.md) and could incorporate any feedback.
Ordinary elements
| background |
foreground |
| base00 |
base05 |
These colours are used for ordinary text.
Locator elements
| background |
foreground and decorations |
| base01 |
base05, base0D, base0E or base0F |
These colours mark the current location.
Text editors: background for the current line
Compositors: borders and title text foreground for focused windows, monitors, and workspaces
Selected elements
| background |
foreground and decorations |
| base02 |
base05, base0D, base0E or base0F |
Inactive elements
The colour base03 is used to indicate that something is not active.
Text editors: comments
Compositors: borders and title text foreground for inactive windows, monitors, and workspaces
Distinguished elements
The colours base08, base09, base0A, base0B, base0C, base0D and base0E
are used to distinguish between different kinds of elements.
Text editors: text foregrounds for syntax highlighting, displayed on the default background colour.
Compositors: borders and tabs for windows in a tabbed arrangement
Plots: line and point colours to represent different variables.
Warning elements
The colour base0F is used for elements that provide a warning.
Commonly used for text and borders.
Text editors: warning text foreground
Alert elements
The colour base08 is used for errors, alerts, and anything urgent.
Commonly used for text and borders.
Text editors: error text foreground
Compositors: window borders
borders and title text foreground for windows, monitors and workspaces that require the user's attention
I wanted to create base16 and base24 themes for Niri (a wayland compositor), and I realised that
styling.mddoesn't offer any advice about how to use the colours in that situation. So I took a step back to create a more abstract view (independent of the application) of how the colours are typically used. Once I had done that, I could logically extend the style guide to cover display managers, compositors, and other kinds of elements.If this is of any interest, I could polish it up and create a pull request to include it (perhaps in
styling.md) and could incorporate any feedback.Ordinary elements
These colours are used for ordinary text.
Locator elements
These colours mark the current location.
Text editors: background for the current line
Compositors: borders and title text foreground for focused windows, monitors, and workspaces
Selected elements
Inactive elements
The colour base03 is used to indicate that something is not active.
Text editors: comments
Compositors: borders and title text foreground for inactive windows, monitors, and workspaces
Distinguished elements
The colours base08, base09, base0A, base0B, base0C, base0D and base0E
are used to distinguish between different kinds of elements.
Text editors: text foregrounds for syntax highlighting, displayed on the default background colour.
Compositors: borders and tabs for windows in a tabbed arrangement
Plots: line and point colours to represent different variables.
Warning elements
The colour base0F is used for elements that provide a warning.
Commonly used for text and borders.
Text editors: warning text foreground
Alert elements
The colour base08 is used for errors, alerts, and anything urgent.
Commonly used for text and borders.
Text editors: error text foreground
Compositors: window borders
borders and title text foreground for windows, monitors and workspaces that require the user's attention