40+ components · HTML/CSS · Zero dependencies

Dark mode done right.

A Scandinavian-inspired design system for developers who want their app to look premium without hiring a designer. Copy-paste components. Ship tonight.

Get Nordic Noir — $19 See components ↓

One-time purchase. No subscription. Free updates forever.

Built with Nordic Noir

Real sites and apps using this design system in production.

Intel Systems

Intel Systems

AI consulting platform with globe visualization and animated data cards.

LANDING PAGE
Opera Brand Dashboard

Opera Brand Intelligence

Executive dashboard tracking 23+ sources with sentiment analysis and AI summaries.

DASHBOARD
CleanDisk

CleanDisk

macOS app landing page with pricing, feature cards, and Stripe checkout.

SAAS SITE
Nordic Grid Storage

Nordic Grid Storage

Battery energy storage investment platform with financial projections.

FINTECH

Color System

8 semantic colors calibrated for WCAG AA contrast on dark backgrounds. Every shade tested at 4+ contrast ratios.

#09090b
#141418
#1a1a1f
Blue
Green
Amber
Red
Purple
White

Typography

Inter + system font stack. 7 weights.

Aa
Headlines that cut
Body text that breathes

Buttons

Primary, secondary, outline, ghost. All states included.

Badges & Tags

Status indicators with semantic colors.

● Active ● Pending ● Error ● Info

Data Cards

KPI cards, stats, metrics — dashboard-ready.

Monthly Revenue
$12,849
↑ 23.4% vs last month

Forms & Inputs

Text fields, selects, toggles. Dark-native.

Landing pages, dashboards, SaaS apps, marketing sites

Every component is copy-paste HTML and CSS. No React required. No Tailwind required. No build step. Works everywhere.

What's included

CORE

Complete Color System

CSS custom properties for backgrounds, text, borders, and semantic colors. Dark mode by default with light mode variant.

CORE

Typography Scale

Headings, body, captions, and code. Responsive sizes with proper letter-spacing and line-heights.

COMPONENTS

40+ UI Components

Buttons, cards, badges, inputs, tables, modals, navbars, footers, pricing cards, hero sections, stat cards, and more.

TEMPLATES

5 Page Templates

Landing page, pricing page, dashboard, blog, and about page. Fully responsive, ready to customize.

LAYOUTS

Bento Grid System

Asymmetric grid layouts like this page. span-2, span-3, responsive breakpoints included.

EXTRAS

Effects & Animations

Subtle glow effects, backdrop blur, hover transitions, fade-in animations. The details that make it feel premium.

One price. Forever yours.

No subscriptions. No per-seat licensing. Buy once, use on unlimited projects.

$19 one-time
Instant download · Free updates · Commercial license