Design Systems

KERNEL

Design system for developer tools and engineering SaaS sites: near-black surfaces, paper-white type, and one acid-lime accent.

HorizonX

Subscribe to download

Instant access Included with every membership
Tokens & components HTML, CSS & design tokens
Commercial license With a membership, for client work

Overview

KERNEL is an industry design system for developer tools and engineering SaaS websites: issue trackers, CI/CD and deploy platforms, observability products, and API platforms. It pairs Mona Sans headlines capped at weight 500 and Fragment Mono issue IDs with a Void / Carbon / Console / Paper token set, one Flash Lime accent reserved for the single primary action, Branch Violet for in-progress states, 10px rectangular controls, 12px surfaces with hairline rings, and a dark imagery language with Hero, Material, and Detail photo roles built around a fictional issue tracker and deploy log called Ferrule. Included: foundations (color, type, spacing, imagery, patterns), components (buttons, cards, dialog, feedback, forms, navigation, table), theme sheet, Ferrule product landing starter, 16:9 launch deck, and sample web photography in assets/imagery/.

Highlights

Developer tools and engineering SaaS industry system
Void / Carbon / Paper + one Flash Lime accent + Mona Sans and Fragment Mono
10px rectangular controls and 12px surfaces with 1px hairline rings
Web imagery roles: Hero · Material · Detail (server aisle, circuit board, keyboard)
Command field, issue table with status badges, deploy capsule, plan compare table
Ferrule product landing + 16:9 launch deck

What's included

theme.json + styles.css tokens
Foundations docs (color, type, spacing, imagery, patterns)
Component specimens with states (HTML)
Ferrule product landing + launch deck
Sample web photography in assets/imagery/
Commercial license with a membership

Frequently asked questions

A complete design system kit: foundations, tokens, HTML/CSS components and written guidelines, ready to adopt in your product.
It's included with a HorizonX membership. Download the kit and drop the tokens and components into your project.
Yes, with a HorizonX membership. Members get a commercial license: use and adapt these files in personal, client and commercial projects. If your plan ends, projects you already built keep their license, but the files can't be used to start new ones.