Theming
Volli paints its window from a canvas: one to three colors placed on the window, plus a vibrancy and a grain amount. Every surface, text tier, border, and accent in the app derives from that canvas and repaints when you change it.
The default canvas starts with one color stop, #e8652a, at 60% vibrancy and
15% grain.
What a canvas is
Section titled “What a canvas is”A canvas has four parts:
- Colors, called stops. One to three of them, each anchored at a point in the window, where its color pools and fades outward.
- A primary. The dominant stop. It’s drawn larger, fades last, and the rest of the app’s colors derive from it.
- Vibrancy. How saturated the canvas is, from a near-neutral wash up to the most each mode allows.
- Grain. A noise layer over the gradient. Zero turns it off.
That’s the whole of it. Panel elevation, card tint, shadow depth, and text weight aren’t settings; Volli holds a fixed set of each for light and for dark, so one canvas covers both modes.
Edit the canvas
Section titled “Edit the canvas”Go to Settings → Appearance → App theme. Every edit paints the real app as you make it and saves when you release the control. There’s no apply button.
The pad
Section titled “The pad”The pad is a minimap of your window, at the same 16:10 proportions, so where a color sits on the pad is where it pools on screen. Each stop is a circle.
- Drag a circle to move that stop.
- Click a circle without dragging to make it the primary.
- Arrow keys move a focused circle by 1%, or 5% with
Shiftheld.
The circles show the colors you picked. What the window paints is a lighter or darker version of each, depending on the mode.
Colors
Section titled “Colors”Below the pad, one chip per stop shows its hex, a swatch of what it paints as in the current mode, and which stop is the primary. Click a chip to promote it.
+ adds a color, up to three. − removes the last stop that isn’t the primary, so it never changes the color the rest of the app derives from.
Only the primary’s color is editable. The others follow it around the color wheel: two stops sit opposite each other, three sit at even thirds. Changing a color never moves a stop, so positions stay where you put them.
The row under the chips sets the primary’s color. It holds nine presets a page,
two pages, with chevrons to move between them, and a hex field. The field takes
#rgb and #rrggbb, with or without the #. A value that parses previews as
you type; Enter or leaving the field keeps it, and Esc puts the previous
color back. A half-typed value is never applied.
Vibrancy and grain
Section titled “Vibrancy and grain”Both run from 0 to 100%. Vibrancy is a slider, with a swatch beside it showing the color at that setting. Grain is a dial: drag it round, or focus it and use the arrow keys.
Vibrancy also affects contrast. The more saturated the canvas, the lower the contrast text on it can reach, and the readout below picks that up.
Contrast
Section titled “Contrast”Volli stays quiet while the canvas meets its contrast floors. If a canvas makes body copy, secondary copy, or sidebar navigation unreachable, an alert names the affected surface. Ease vibrancy to … appears when a lower vibrancy can clear the floor. If no vibrancy clears it, change the color.
Light, dark, and auto
Section titled “Light, dark, and auto”Settings → Appearance → App theme → Mode offers Light, Dark, and Auto. Auto follows macOS.
Mode and canvas are separate settings. The same canvas renders in both modes, and a project can override either one on its own.
Use a different theme for one project
Section titled “Use a different theme for one project”Open Configure → Appearance for that project. It has three sections: App theme, Editor, and Terminal.
App theme gives Mode and Canvas separate Inherit / Custom controls. A project can pin its mode while inheriting the app-wide canvas, or use its own canvas while following the app-wide mode. Editor and Terminal each have their own scope control.
Every control starts on Inherit and says what the project is following. Custom pins the value already showing, so switching to it does not repaint the app until you edit. A custom Canvas opens the same editor Settings uses, scoped to this project.
Switch back to Inherit to drop that override. The project follows the app-wide setting again, including later changes.
While the current project overrides the canvas, Settings → Appearance → App theme shows Project override. Edits there still go to the app-wide canvas, not to the one this window is showing.
What the terminal does
Section titled “What the terminal does”The terminal is the one surface that doesn’t always follow your canvas. Ghostty configuration takes precedence over Volli’s.
- If you haven’t set a Ghostty theme, the terminal takes its background, foreground, cursor, and normal red from the app’s derived colors, and repaints as soon as you change the canvas or the mode.
- If a Ghostty theme is set, in your own
~/.config/ghostty/configor through Volli’s terminal settings, that theme wins. Atheme = light:X,dark:Ypair is re-read on every mode change, so you get the half that matches.
The other fifteen ANSI colors are fixed per mode: a restrained set tuned for a near-black background in dark, and GitHub Light Default in light. Volli has no app color to derive them from.