Skip to content
fmindPublic

About

A practical light theme with native files for editors, terminals and apps.

Topics

Resources

Stars

2 stars

Watchers

0 watching

Forks

Repository files navigation

fmind/theme

A light theme for code, terminals and apps, and the Fmind design system. Native files live in one folder per app under themes/; DESIGN.md describes the design for agents and design tools.

Previews · Design system · Palette · Themes · Contribute

Changelog · Previous releases

Fmind theme logo

Previews

Code, shell, search and selection Markdown
Neovim and Fish in Zellij Markdown in Neovim

Synthetic terminal captures made with VHS. Download wallpapers and social banners, or preview all artwork.

Design system

DESIGN.md is the single source for Fmind's visual identity: color roles, typography, layout, shapes, diagram components and do's and don'ts. It follows the DESIGN.md format (alpha): YAML design tokens followed by prose rationale. Edit it here; consumers read it or export it instead of copying values.

It is the default for Médéric Hurier's own work. Customer or employer work uses that organization's design system, and an existing project keeps its established identity.

Consumer How it uses DESIGN.md
Coding agents (Claude Code, Codex, Copilot, Gemini CLI, OpenCode, Grok, agy) fmind/dot deploys a checksummed copy to ~/.agents/DESIGN.md, and its shared AGENTS.md persona points every agent to it.
A project repository Copy DESIGN.md to the project root, where design-aware agents look for it, or link to ~/.agents/DESIGN.md from the project's AGENTS.md.
Google Stitch Provide DESIGN.md as the design system for generated UI; the format originates from Stitch.
Tailwind CSS v4 or v3 npx @google/[email protected] export --format css-tailwind DESIGN.md emits an @theme block; --format json-tailwind emits v3 theme.extend JSON.
Figma variables, Style Dictionary, Tokens Studio npx @google/[email protected] export --format dtcg DESIGN.md emits W3C Design Tokens JSON.
Plain CSS (Zensical, static sites) npx @google/[email protected] export --format css-vars --prefix fmind DESIGN.md emits custom properties.
Diagrams, decks, illustrations and demos The fmind-visuals and diagrams-as-code skills in fmind/dot adapt the tokens to D2, Mermaid, SVG, Typst and VHS.
Terminals, editors and apps Use the native files under themes/; palette.yaml maps the same colors to syntax and ANSI roles.

Validate changes with npx @google/[email protected] lint DESIGN.md (structure, references and WCAG contrast) and compare revisions with npx @google/[email protected] diff old.md DESIGN.md. mise run test checks offline that the tokens match the palette and that component text meets 4.5:1.

Palette

Fmind colors and their roles

The palette uses the 15 Google News hex colors plus five complementary colors. Dark shades carry text, pale shades provide surfaces, and bright shades identify active states. Text stays upright; bold adds emphasis.

Color Hex Syntax and text Interface and backgrounds
White #FFFFFF Label text on dark fills Main background
Light gray #F1F3F4 — Panels, cursor line and neutral diffs
Gray #9AA0A6 — Decorative borders and separators
Dark gray (custom) #595D62 Comments, gutter numbers and secondary text Essential control borders and scrollbar thumbs; ANSI bright black
Charcoal #202124 Body text, variables and punctuation Labels on bright fills; ANSI black/white
Dark blue #174EA6 Keywords, functions, keys and headings Navigation and links; ANSI blue
Medium blue #4285F4 — Cursor and active label fills
Light blue #D2E3FC — Selections, completions and inactive ribbons
Dark red #A50E0E Errors and deleted text Failures and deletions; ANSI red
Medium red #EA4335 — Cut markers and error underlines
Light red #FAD2CF — Deletion backgrounds
Dark orange (custom) #934900 Numbers, constants and warnings Changes and attention; ANSI yellow
Orange #E37400 — Warning accents
Yellow #FBBC04 — Active tabs, current search matches and changed words
Light yellow #FEEFC3 — Change backgrounds and ordinary search matches
Dark green #0D652D Strings and added text Success, additions and executables; ANSI green
Medium green #34A853 — Mode labels, copy markers and success accents
Light green #CEEAD6 — Addition backgrounds
Purple (custom) #681DA8 Types, builtins, decorators and emphasis Secondary accents; ANSI magenta
Teal (custom) #00636D Informational diagnostics Information and icons; ANSI cyan

Available themes

Choose a tool for installation instructions and theme files. Some ports are experimental or incomplete; inclusion here does not certify native application support.

Contribute

Edit native files under themes/ directly. For a new or corrected port, cite its native format, document installation in its own README, add its directory to the alphabetical list above, and test its actual colors and representative states. Report the app version and platform used; distinguish parser checks from native loading and visual testing.

Validation checks shared palette contrast, JSON/TOML/YAML syntax, documentation links and artwork integrity. Verify changed themes manually in their native apps.

Run mise install and mise run install to install tools, validation dependencies and Git hooks. Use mise run format to format Python and repository documentation/configuration, then mise run all to validate. Lefthook formats staged files in scope and runs checks before commits, and runs tests before pushes. See maintenance for formatting scope and tasks.

Releases

Releases use explicitly chosen versions and immutable annotated tags. Follow the release procedure; verify CI for the release commit before tagging. Source archives are the release payload.

Maintained alongside fmind/dot. MIT license; bundled Google Sans retains its OFL license.

About

A practical light theme with native files for editors, terminals and apps.

Topics

Resources

Stars

2 stars

Watchers

0 watching

Forks

Releases

Packages

Used by

Contributors

Languages