Design Systems

MARGIN

Design system for docs, wiki and knowledge-base software sites: warm paper canvas, white sheets, one fountain-pen blue and sticky-note panels.

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

MARGIN is an industry design system for productivity, docs and knowledge-base software: product landing pages, template galleries, pricing and plan comparisons, workspace sign-up, and investor or all-hands decks. It pairs Inter for headings and interface with Source Serif 4 for ledes and quotes over a warm Paper / Sheet / Pencil / Graphite token set, one Fountain Blue for actions, a sticky-note panel cast (Peach, Sun Note, Tomato, Sky, Wash, Cocoa, Night), highlighter pills behind key words, 12px sheets with hairline edges, 10px controls, and a sunlit imagery language with Space, Material and Object photo roles built around a fictional workspace app called Quillpage. Included: foundations (color, typography, spacing, imagery, patterns), components (buttons & pills, cards & panels, dialog, forms, navigation, feedback, table), theme sheet, Quillpage workspace landing starter, 16:9 pitch deck, and sample web photography in assets/imagery/.

Highlights

Productivity, docs and knowledge-base software industry system
Paper / Sheet / Pencil / Graphite + Fountain Blue + Inter and Source Serif 4
Sticky-note panel cast and highlighter pills behind key words
12px sheets with hairline edges, 10px controls, pills for tags and status
Web imagery roles: Space · Material · Object (sunlit desk, paper, pen)
Quillpage workspace landing + 16:9 pitch deck

What's included

theme.json + styles.css tokens
Foundations docs (color, typography, spacing, imagery, patterns)
Component specimens with states (HTML)
Quillpage workspace landing + pitch 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.