-
Notifications
You must be signed in to change notification settings - Fork 0
Focus Themes
Six dark themes that share one structure and differ only in colour. The structure
lives once in FocusThemes/Themes/gen-themes.py; each direction is a row in that
file's PALETTES table, and the .vstheme files are its output.
What separates the family from Graphite is that all five C# type kinds get a
colour of their own. class carries each direction's primary type hue and
interface a lighter tint of it, set in italic — same family, unmistakable at a
glance. record, struct and enum each take a hue of their own, because a
data shape and a state name are not the same kind of thing as a service.
Two roles in every direction are tints rather than hues of their own: variable
is the plain-text hue desaturated, and operator is the keyword hue lightened.
Color Roles explains why, and lists which classifications each
role paints.
The palettes come from a set of design explorations. Every syntax hue and the three surface depths are read from the design; the raised surface, border, selection, gutter grey, tag and brace colours are each stated as a function of one that was.
In all six directions except Nightdive, the accent — the status bar and the active-tab underline — is the keyword hue. Nightdive is the exception: its keywords are coral, but the teal that marks classes carries the chrome instead.
Comments and the gutter sit below WCAG AA (4.5:1) on purpose, at a floor of 3.0:1. Every direction in the design makes commentary recede, and lifting it to AA would put comments at the same weight as code. The generator reports the figure on every run rather than silently correcting it.
Hot pink keywords against cyan types: the two loudest hues sit at opposite ends of the wheel, so structure registers before a word is read. Reference types stay cool — cyan class, mint italic interface — and value types go warm, with lime records, amber structs and orange enums. The cool/warm split alone says what you are looking at.
| Role | Hex |
|---|---|
| keyword | #FF2E88 |
| class | #3BE8FF |
| interface | #6FFFD1 |
| record | #B6FF3D |
| struct | #FFD24D |
| enum | #FF7A1A |
| method | #9B8CFF |
| variable | #AEBED6 |
| operator | #FF9EC4 |
| string | #4ADE80 |
| number | #FFF275 |
| comment | #5A6A85 |
| Surface | Hex |
|---|---|
| editor | #090B10 |
| chrome | #0D1017 |
| panel | #0B0E14 |
| raised | #1D2129 |
| border | #102A31 |
| selection | #32363D |
| plain text | #D6E1F2 |
| gutter | #556070 |
| accent | #FF2E88 |
A violet ground with magenta classes, sky records and mint structs. Behaviour and data occupy different temperature zones, so a DTO never reads as a service.
| Role | Hex |
|---|---|
| keyword | #C77DFF |
| class | #FF6EC7 |
| interface | #FFB3E3 |
| record | #6BE1FF |
| struct | #5CFFB1 |
| enum | #FF9060 |
| method | #FFD166 |
| variable | #B7ABD4 |
| operator | #E0BFFF |
| string | #A3FF6B |
| number | #FFF3A3 |
| comment | #6E5A8C |
| Surface | Hex |
|---|---|
| editor | #0B0714 |
| chrome | #120C1F |
| panel | #0E0918 |
| raised | #231C31 |
| border | #2D1C3E |
| selection | #363143 |
| plain text | #E4DAFF |
| gutter | #64577D |
| accent | #C77DFF |
A green-black ground reads calmer than a blue one, which lets a single orange accent carry all the urgency. Aqua class, pale-aqua italic interface, violet record, pink struct, azure enum — five type kinds, five clearly separated hues. Literals are kept in one chartreuse family so they never compete with declarations.
| Role | Hex |
|---|---|
| keyword | #FF7A1A |
| class | #2EF2C2 |
| interface | #9FFFE3 |
| record | #A78BFA |
| struct | #FF6EA9 |
| enum | #63D8FF |
| method | #FFE066 |
| variable | #A9C7C0 |
| operator | #FFB27A |
| string | #C6FF4D |
| number | #E8FF9E |
| comment | #4E6E68 |
| Surface | Hex |
|---|---|
| editor | #06100E |
| chrome | #0A1715 |
| panel | #081310 |
| raised | #1A2926 |
| border | #0C342B |
| selection | #303D3A |
| plain text | #D8F3EC |
| gutter | #49665F |
| accent | #FF7A1A |
The loudest of the six: five saturated hues at near-equal weight. Nothing recedes except comments, which is the point — every token class claims its own hue rather than sharing one. With five type kinds in play, that puts real pressure on the yellow family.
| Role | Hex |
|---|---|
| keyword | #FF3D7F |
| class | #FFE94E |
| interface | #FFF9C4 |
| record | #FF9F1C |
| struct | #3DFFC9 |
| enum | #C084FC |
| method | #4DA8FF |
| variable | #C0B4D1 |
| operator | #FF9CC0 |
| string | #9FFF6B |
| number | #D9FFB3 |
| comment | #6B5E7A |
| Surface | Hex |
|---|---|
| editor | #0D0912 |
| chrome | #150F1C |
| panel | #100B16 |
| raised | #27202E |
| border | #391226 |
| selection | #3B3641 |
| plain text | #F2E9FF |
| gutter | #625A6E |
| accent | #FF3D7F |
The restrained option. A neutral grey-black ground, one orange-red accent for keywords, cooler hues for everything else. All five type kinds still separate cleanly — blue class, pale blue italic interface, violet record, teal struct, pink enum — but nothing shouts. The safest pick for eight-hour days.
| Role | Hex |
|---|---|
| keyword | #FF5C39 |
| class | #35C2FF |
| interface | #A5DEFF |
| record | #C084FC |
| struct | #2DD4BF |
| enum | #F472B6 |
| method | #FBBF24 |
| variable | #B4BAC7 |
| operator | #FF9E85 |
| string | #4ADE80 |
| number | #A3E635 |
| comment | #6B7280 |
| Surface | Hex |
|---|---|
| editor | #101116 |
| chrome | #16181F |
| panel | #13151B |
| raised | #272930 |
| border | #2A2B30 |
| selection | #3B3C41 |
| plain text | #E6E8EF |
| gutter | #5E616A |
| accent | #FF5C39 |
Deep teal-black with coral keywords, chartreuse records and lavender structs — complementary pairs, so declarations never blur together in dense files.
This is the only direction whose accent is not its keyword hue. The design puts
coral on keywords but keeps the teal that marks classes on the status bar and the
active-tab underline, so accent and keyword part company here.
| Role | Hex |
|---|---|
| keyword | #FF6B6B |
| class | #4DE1C1 |
| interface | #A8F5E6 |
| record | #C6FF4D |
| struct | #B39BFF |
| enum | #FF9BD2 |
| method | #59B8FF |
| variable | #A3BFC7 |
| operator | #FFA8A8 |
| string | #FFC24D |
| number | #FFE3A8 |
| comment | #4A6B75 |
| Surface | Hex |
|---|---|
| editor | #040F14 |
| chrome | #08171D |
| panel | #061319 |
| raised | #18282E |
| border | #103130 |
| selection | #2D3B40 |
| plain text | #D2ECF2 |
| gutter | #47636A |
| accent | #4DE1C1 |
Sample/AllTokens.cs in the repository is a compact catalogue of every C#
classification the themes paint, arranged one group per region. Open it with a
theme applied and read down: if a group is not colour-separated from its
neighbours, that is the palette failing its own first rule.
To change a palette, see Contributing — the .vstheme files are
generated output and are never edited by hand.