MovingParts

A bold, Swiss-grotesque developer-tool marketing surface built on white canvas with near-black ink, oversized 110px display headlines, and razor-sharp zero-radius buttons, cards and inputs. The system reads as confident and engineering-first — huge condensed-feeling headlines, a high-contrast black product section, embedded iOS/SwiftUI device mockups as content, and small chromatic accents (electric green, violet, pink) drawn from product swatches and syntax-highlighted code. Brand voltage comes from scale and contrast rather than decoration.

movingparts.io

Works with Claude Code·Cursor·Codex·Gemini CLI·Copilot·v0·Lovable·Bolt·Windsurf·Replit

↓ .md ↓ All files

loading…

Color Palette

Accent

Neutrals

Typography

h2 110px · 700 · 0.95

The quick brown fox jumps

body 40px · 400 · 1.27

The quick brown fox jumps

h3 26.67px · 600 · 1.47

The quick brown fox jumps

button 28px · 600 · 0.95

The quick brown fox jumps

Spacing & Shape

Spacing

Name	Value	Preview
xxs	4px
xs	5px
sm	12px
md	16px
lg	18px
xl	20px
xxl	21px
xxxl	24px

Border Radius

Name	Value	Preview
none	0px
xs	2px
sm	14px
md	16px
lg	18px
xl	24px
2xl	35px
round	50px
device-sm	77px
device-md	90px
device-lg	106px

FAQ

What colors does MovingParts use?: MovingParts's core palette includes #121212, #000000, #ffffff, #ffffff, #191919. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the MovingParts DESIGN.md.
What font does MovingParts use?: MovingParts's primary typeface is Unica77. The complete type scale (sizes, weights, line-height and letter-spacing per role), with an open substitute where the original is licensed, is documented in the DESIGN.md.
What is the MovingParts design system?: A bold, Swiss-grotesque developer-tool marketing surface built on white canvas with near-black ink, oversized 110px display headlines, and razor-sharp zero-radius buttons, cards and inputs. The syste…

More like this

↓ .md ↓ All files

loading…