Primary Simplified

by voi-tech
Screenshot of the Primary Simplified Obsidian theme
5
4
3
2
1

Description

This theme supports Dark Mode
This theme supports Light Mode

README file from

Github

Primary Simplified for Obsidian

Primary Simplified is a warm, quiet Obsidian theme based on the original Primary theme by Cecilia May.

It keeps the soft Primary palette, rounded interface details, readable typography, expressive checkboxes, and friendly callouts, but trims the theme down to the parts that make sense in a current Obsidian vault. The result is less busy than the original Primary, while still keeping its recognizable feel.

Requires Obsidian 1.13 or newer — the theme styles 1.13+ surfaces (including Bases) and relies on CSS variables introduced in that release. It also supports Obsidian 1.14: coloured highlights, the Bases kanban layout, the redesigned empty tab and the ribbon's new logical-side class names. Tested on Obsidian 1.15.1, whose Mermaid diagrams take the theme's colours natively.

Screenshots

Primary Simplified in light and dark mode

A note with a banner, heading labels and the editing area in light mode Reading view in dark mode with a quote, a callout, a table and code
Banner with title, Colorful heading labels, the editing area frame and bold folder names. Dark reading view: Subtle heading labels, quote, callout, table, code and footnotes.
A journal note with a teal Custom accent The theme's Style Settings, Appearance section
The Custom accent (here the nietech teal) on highlights, links, tags, checkboxes and the file tree. Style Settings: every option has a short description and a default.

What It Feels Like

Primary Simplified is meant for everyday writing and note work. It favors calm contrast, tidy and unobtrusive controls, and enough color to make tasks, callouts, folders, and active UI states easy to scan.

The theme includes:

  • light and dark palettes
  • alternative checkbox icons enabled by default
  • tuned callout colors
  • folder and bookmark color presets
  • optional layout density; the Custom accent takes Obsidian's accent colour and carries it through links, highlights, inline code, tags, active tabs and the file tree
  • a marked editing area: a rounded frame around the text you can click into in Live Preview and Source mode, from below the properties to the last line
  • optional heading backgrounds: rounded labels, neutral or one palette hue per level
  • one corner-radius scale (4, 8, 12, 16 px, as in the nietech brand), rounded tables, and one accent focus ring for keyboard navigation
  • note banners: a header image, icon and title per note through cssclasses (see Banner)
  • focus mode: ribbon, tab bar, note header and status bar fade out until hovered
  • reduced-motion and forced-colors support
  • Obsidian 1.13+ surfaces, including Bases (and the 1.14 kanban layout)
  • 1.14 coloured highlights keep their chosen colour
  • 1.14 corner shapes (squircles on macOS) on the surfaces the theme rounds itself, and right-to-left layouts for the ribbon and status bar
  • per-note helper classes compatible with Minimal's cssclasses contract (image grids, block widths, embeds, table styling, cards) — see minimal.guide/features/helper-classes for the full class reference

What It Is Not

  • Not a pixel-perfect copy of Primary. The simplifications below change some visual and configuration details from the original.
  • Not a skin for Calendar or Kanban. The original Primary theme includes dedicated styling for those two community plugins; this fork does not. Those plugins render with their own default appearance layered on this theme's base colors.
  • Not a theme with manual per-element color/size controls. Style Settings offers curated presets (accent palette, layout density, heading background, etc.) instead of free-form color pickers and sliders.
  • Not officially affiliated with or supported by Cecilia May or the original Primary project.

How This Differs from Primary (and Why)

  • Style Settings consolidated to a focused set of toggles and presets. The original panel had grown into hundreds of entries, including manual-entry color/size/slider controls and a YAML structure that didn't parse reliably. Primary Simplified replaces most of that with class-based presets (accent palette, layout density, heading background, and similar) that cover the same visual range with far less fragile surface area.

  • Checkbox icons unified to a single outline style. Some states in the original mixed filled, hard-coded-color badges with outline icons, which could render invisible or inconsistent depending on the color. Every checkbox state now uses the same outline treatment.

  • No dedicated Calendar or Kanban plugin skins. The theme's scope is limited to core Obsidian surfaces instead of maintaining bespoke styling for specific community plugins that can drift out of sync with plugin updates.

  • Removed unused per-folder bookmark color aliases. These duplicated the folder color variables without being exposed anywhere in Style Settings. Folder and bookmark coloring now share one consolidated preset.

  • No bundled font files. Obsidian already ships Inter, so re-bundling it added unnecessary weight; the monospace fallback is handled through a CSS variable instead.

  • Added prefers-reduced-motion and forced-colors support, which the original theme does not have.

  • Added per-note helper classes matching Minimal's cssclasses contract (image grids, block widths, embeds, table variants, cards/list-cards) — a feature the original Primary doesn't offer.

  • One palette file as the single source of colour. Every colour in theme.css (callouts, links, accents, task icons, alpha tints) is a step of tokens/palette.tokens.json (W3C Design Tokens format): 9 hues × 14 steps, light and dark. Steps share their OKLCH lightness with the gray of the same number, so step 110 is readable text in every hue, step 60 a line, step 30 a tint. The original scales had 4 steps per hue, too few for text-safe yellows and greens, which is why hand-picked colours kept creeping in. Projects that follow the theme (the nietech brand, site and apps) copy the same file instead of keeping their own colours.

Palette workflow

Edit colours only in tokens/palette.tokens.json, then:

node scripts/palette.mjs check          # every scale complete, lightness and WCAG contrast rules
node scripts/build-palette.mjs          # rewrites the generated block in theme.css
node scripts/build-palette.mjs --check  # CI: block current, no colour literal outside it
node scripts/palette.mjs sheet out.html # preview sheet of all scales with contrast

Outside the generated block a colour may only be var(--color-l|d-<hue>-<step>) or a color-mix() of it. Allowed exceptions: black/white with alpha in shadows and bevels, and the user's own accent under Accent palette > Custom.

Net effect: a smaller, easier-to-maintain theme (theme.css dropped from roughly 1.7 MB to about 325 KB) that keeps Primary's recognizable palette and visual language.

Install

Primary Simplified is available in Obsidian's Community Themes:

  1. Open Settings > Appearance in Obsidian.
  2. Choose Manage next to Themes.
  3. Search for Primary Simplified.
  4. Install and use it.

For manual installation:

  1. Download manifest.json and theme.css from a release.
  2. Create this folder in your vault: <vault>/.obsidian/themes/Primary Simplified/.
  3. Put both files in that folder.
  4. Reload Obsidian.
  5. Select Primary Simplified in Settings > Appearance > Themes.

Style Settings

The theme works without the Style Settings plugin. The default look, including alternative checkbox icons, is built into the theme itself.

If you install the optional Style Settings plugin, Primary Simplified adds a small set of controls for the choices people are most likely to adjust:

  • accent palette (Default or Obsidian's accent)
  • layout density
  • colorful headings and heading background
  • editing area (sheet, outline or off)
  • line width (narrow, normal, wide)
  • focus mode
  • dimmed images in dark mode
  • hidden properties heading, "Add property" button shown on hover
  • bold folder names
  • banner height
  • reduced motion
  • popup blur
  • ribbon and status bar behavior
  • editor background
  • active-line highlight
  • title lines under H1 and inline title
  • link underlines
  • alternative checkbox icons
  • note embed titles
  • folder and bookmark color presets

Use Obsidian's built-in Appearance settings for font families, accent color, and editor font size.

Banner

Adapted from Baseline (MIT). Add classes to a note's cssclasses and mark the image with the banner alt text:

---
cssclasses: [banner, banner-fade, banner-icon, banner-title, y40]
---
![[mountains.jpg|banner]]
> [!banner-icon] 🌊
Class Effect
banner the image with alt text banner becomes the header image
banner-fade fades the image's lower edge into the page
banner-icon the banner-icon callout becomes the note icon
banner-title puts the inline title next to the icon
y0 ... y100 vertical crop position of the image, in steps of 5
banner-image-contain, banner-image-fill image fit instead of cover

Notes handled by the Pixel Banner or Banners plugins are left alone. Banner height is set under Style Settings > Banner.

Attribution

Primary Simplified is an independent fork of Primary. It is not affiliated with or endorsed by Cecilia May or the original Primary project. See How This Differs from Primary for what changed and why.

The original Primary theme remains available from Obsidian's Community Themes directory. If you want to support Cecilia May's original work, visit the author's Ko-fi page.

The image grid, cards, and list-cards helper classes are adapted from Minimal by Steph Ango (@kepano), used under Minimal's MIT license (notice included in theme.css).

The banner feature is adapted from Baseline by svnaxis, used under Baseline's MIT license (notice included in theme.css).

License

Primary Simplified is licensed under the GNU General Public License v3.0. The repository keeps the original copyright and license notices from Primary, and the MIT license notice for the Minimal-derived helper-class rules and the Baseline-derived banner rules noted above.