Vimix Yellow

A modern, macOS-inspired Bootstrap 5 theme for Ubuntu — soft rounded controls, vibrancy chrome. Two modes: light and dark.

Palette

Navbar

Buttons & Button Groups

Contextual variants

Outline variants

Sizes & states

Button groups & segmented control

Typography

h1. The quick brown fox

h2. Jumps over the lazy dog

h3. Pack my box with five dozen

h4. Dozens of liquor jugs

h5. How vexingly quick daft zebras
h6. Jump!

A lead paragraph set at a larger size for introductory content.

Body copy prefers the San Francisco system stack, then Ubuntu, giving the same soft rhythm on GNOME and macOS.

Inline elements like links, bold text, emphasis, inline code, Super + Space and highlighted text all follow the active variant.

Secondary text is used for supporting copy and metadata.

Small print, footnotes and legal text.

Display headings

Display 6

Display 5

Blockquote

Everything is designed. Nothing is accidental.

Design principle

Lists

  • Soft, rounded GNOME-style controls
  • Two modes: light and dark
  • Full light and dark mode parity

Tables

Applications
Name Type Size Status
FilesSystem— Active
TerminalUtility1.2 MB Installed
SoftwareStore4.8 MB Updates
RhythmboxMedia2.6 MB Paused
Variant Accent Dark accent
Blue#007aff#0a84ff
Purple#af52de#da8fff
Yellow#ffcc00#ffd60a

Forms

We'll never share your address.
Name is available.
Slugs cannot contain spaces.

Search & input groups

@
$ .00

Checks, radios & switches

Range

Floating labels

Navs & Tabs

General settings panel.
Display settings panel.
Storage settings panel.
You should not see this.

Segmented

Pills & underline

Breadcrumbs

Pagination

Alerts

Badges

Primary Secondary Success Danger Warning Info Light Dark Pill Solid
Mail 12+ Draft

Progress & Spinners

Basic & contextual

Striped & animated

Stacked

Spinners

List Groups

Default & active

  • Favorites
  • Recents
  • Shared
  • Trash

Linked & actions

Dash Files Web

Custom (primary)

  • Primary item
  • Another primary item

Flush

  • Flush item
  • Flush item

Inset (settings style)

  • Appearance
  • Privacy
  • Displays

Cards

Basic

A plain card with a body.

Action
Primary

Contextual card.

Action
Success

Contextual card.

Glass

Vibrancy card with backdrop blur.

Bordered
Primary border

Cards support all contextual border colours.

Updated 2 minutes ago
Header, body & footer

Cards compose cleanly with headers and footers.

HiDPI ready
Card with list group
Backgrounds
Accent colour
Icons
Settings sync completed.

Accordions

Default

GNOME and macOS both favour soft, rounded surfaces that read as approachable.

Nine accent variants are defined purely in CSS custom properties — no extra stylesheet needed.

Every variant gets a brighter accent in dark mode so contrast stays comfortable.

Flush

Flush variant removes the outer border.

Each item is styled as a rounded card.

Carousel

Modals

Offcanvas

Sidebar
  • Favorites
  • Recents
  • Shared
Inspector
Panel content goes here.
Toolbar
A top drawer, handy for filters.

Popovers & Tooltips

Hover me

Toasts

Placeholders

Misc

Close buttons

Standalone dropdowns

Usage

Vimix Yellow is a colour sibling of Vimix. Swap the variant at any time — it is a single attribute and needs no extra stylesheet: <html data-bs-theme="dark">