Anatomy of a Light Theme: Sakura

Sakura takes its colors from a cherry blossom garden in full bloom: a tree of soft pink flowers, the green of the leaves and grass below, and a clear spring sky behind. The job of the theme is to keep that garden on screen while you work, light enough for a bright room and soft enough to feel like the season. Here is how Sakura is built, color by color, and why each one sits where it does. It is the blossom colored sibling of the daylight Autumn teardown, and the light answer to the dark trio, the icy Everest, the cool Aurora Borealis and the dusky Roraima. Its petal pink is the same one the HWB post mixed from a rose hue drowned in white.

A Garden In A Palette

The source description sets the brief in one breath. Delicate pinks for the blossoms as the backdrop, muted greens and blues as complementary accents for the tranquil garden and the clear sky. So the structure of the theme is the blossom, soft and high, and the color is the garden it sits in, the green and blue rationed against the pink.

You can read the whole palette as that one scene. The light is a family of soft blossom whites, the editor #FEFCFC and the panels just below it in petal pink. The garden is the set of colors on top: a deep sakura rose #B54B66 for the accent that runs through the interface, and the greens and blues of the garden and sky for the code.

The Harmony: Blossom, Leaf And Sky

Where Autumn ran a long warm sweep and Roraima split warm against cool, Sakura is built on the pink blossom answered by its natural complements, the green leaf and the blue sky. Lay its colors out and the pinks gather near 330 to 350 degrees, the roses and blush of the flowers, while the greens sit near 130 and the blues near 205, the complementary other side of the wheel that a blossom is always seen against.

It works because these are colors that already belong together outside. Pink flower, green leaf and blue sky are the ordinary sight of a spring day, so a palette drawn from a blooming tree reads as one calm garden rather than a set of unrelated highlights. The pink does the leading, the green and blue keep it from turning saccharine, and because every hue is softened toward the light, the whole screen stays gentle rather than loud.

Backgrounds, Built From Blossom

A light theme lives or dies on its whites, and Sakura never draws a hard line between panels. It stacks soft blossom tones and lets a small step of lightness do the dividing:

  • Surface #F8DBE6, the petal veil, the outermost frame the window sits in.
  • Window #FCF4F7, the pale petal of the tool windows, tabs and panels.
  • Editor #FEFCFC, the blossom white the code is written on, the brightest of the set.

None of these is a flat white. Each is a blossom tone pulled almost all the way up to the light, so the brightness has a blush in it. When you select text the theme reaches for a full bloom pink, #FFC9DC, and the active line lifts to a soft spring leaf, #DBEACB, so even the highlights come from the garden rather than from a generic blue.

One Foreground, Several Voices

The reading happens on the foreground, and Sakura leans on one main color for it: a deep cherry maroon #3D0013, not pure black. Against the soft blossom white editor that lands the contrast comfortably, dark enough to read all day, warm enough that it never cuts the way pure black on pure white can.

From that one anchor the theme builds its quiet hierarchy. Secondary text lifts to a mauve shadow #94667D, and comments go quieter still, so your notes sit behind your code without vanishing. That is the same contrast ladder from the readability post: importance read as darkness, not as another loud color.

Syntax: The Colors Of The Garden

Open a file and the garden fills in. The structure of the language is painted in things you would find under a blooming tree:

  • The loud tokens in a rose garden #CB6B91 and a deep sakura #B54B66, the fullest blossoms on the branch.
  • Mid tones in a soft blush pink #EFA5BF and a quieter plum wine #98556C, the petals in shade.
  • The green code in a calm tea leaf #618C71 and a brighter new stem #AEC09B, the leaves under the flowers.
  • Keywords in a clear sky blue #397FB7 and a river stone #607FA9, the day behind the tree.
  • A soft pollen gold #BC9C5C for the warm accent, the dust at the center of a bloom.

Line them up and they are the garden itself: rose and blush for the blossom, plum for the petals in shade, green for the leaves, blue for the sky, and a gold for the pollen. Because the pinks lead and the green and blue only answer them, the code reads as one calm garden in bloom rather than a scatter of bright signals.

Explore Our Themes

Reading It Back

Put the pieces together and the theme tells one story. Soft blossom whites give brightness without ever going to a hard, flat white. A deep cherry foreground, lifted through mauve, keeps the reading calm. A garden palette, rose and blush leading, green leaf and blue sky answering, carries the syntax in the colors of a blooming tree, with a soft pollen gold for warmth and a deep sakura accent running through the interface. Every color is doing a job, and the jobs all point back to the same spring morning under the flowers.

Want to try it in the editor you already work in? Sakura installs on JetBrains, VS Code, Cursor, Chrome, Slack and Ghostty, all from its theme page.

Codigrate

Codigrate