UI Skillbook
2

Design systems set in SF Mono

Brands and apps whose DESIGN.md names SF Mono as a typeface, including 1Password, ADP and Affirm. Each file also lists the sizes, weights and colors that go with it, so your coding agent can match the whole style.

108 files, page 2 of 3

Files

Kakao T (카카오 T)

Brands · Pretendard

Kakao T is the all-in-one mobility app from Kakao Mobility — taxi, designated-driver (대리운전), parking, bike, navigation, flights, and quick-delivery, all behind one yellow "T". Its visual identity sits on a knife's…

Kdan Mobile

Brands · Clear Sans

Kdan Mobile presents itself as bold, modern, and developer-credible document software, the kind of digital-workflow SaaS that signs contracts and ships SDKs without losing its sense of energy. The atmosphere is built…

KKBOX

Brands · Work Sans

KKBOX wraps its interface in a near-black, cinematic canvas where the music itself feels like the source of light. The ground is a deep #111111 that recedes into the background, letting album art, hero photography,…

KKday

Brands · SF Mono

KKday is a Taiwan-born online travel marketplace — the place a traveler books a tea-ceremony in Kyoto, a SIM card for Bangkok, or a high-speed-rail pass before a trip — and its design system is built for one job:…

KRAFTON

Brands · Poppins

KRAFTON is a South Korean game publisher and developer whose digital identity is built entirely in monochrome — deep black surfaces carry white type and logotypes while a proprietary KRAFTON typeface, Zalando Sans…

LayerX

Brands · Inter

LayerX is a Tokyo-based "compound startup" whose mission — すべての経済活動を、デジタル化する ("digitize all economic activity") — sets the tone for a design language that is at once corporate-trustworthy and quietly futuristic. The…

Lenovo

Brands · Lato

Computing and device retail with black-red branding, practical hierarchy, and broad catalog structure. Lenovo's public site uses a black-white base, red brand accents, and hardware-forward merchandising.

LG

Brands · LG Smart

Consumer electronics and appliances with deep red branding, glossy product presentation, and broad lifestyle-tech merchandising. LG's public site uses white and dark surfaces, a burgundy-red accent, and premium…

Lowe

Brands · Helvetica Neue

Home improvement retail with deep blue trust cues, clean retail structure, and project-friendly browsing. Lowe's public site uses a blue-led brand frame, white surfaces, and straightforward shopping modules for…

McDonald

Brands · Speedee

Fast-food commerce with strong red-and-yellow branding, friendly utility, and mainstream consumer accessibility. McDonald's public site uses bright brand color, white space, large food imagery, and clear app/deal CTAs.

Medium

Brands · Charter

Reading and writing platform with magazine-like simplicity and strong black-and-green branding. Medium's public site uses restrained editorial layout, serif-forward reading tone, and the signature Medium green (#1A8917).

Mistral

Brands · Arial

Frontier AI platform design with sharp black foundations, a warm orange-to-yellow signature spectrum, and highly controlled enterprise product framing. Mistral combines open-model energy with direct, no-frills…

Monday.com

Brands · Poppins

Work management with vivid color coding, polished SaaS structure, and strong product modularity. Monday.com's public site uses bright multicolor accents, white surfaces, dark text, and highly polished work-platform…

Neon

Brands · Inter

Serverless Postgres design with dark developer-native surfaces, bright green database accents, and branch-based workflow clarity.

Nokia

Brands · Inter

Connectivity-for-the-AI-era branding with cool gradients, dark technological depth, and clean industrial structure. Nokia’s current site uses bright blues and teals, dark network surfaces, and modular enterprise…

Nutanix

Brands · Inter

Hybrid-cloud platform design with deep purple branding, dark product surfaces, and enterprise infrastructure clarity. Nutanix’s current visual language frames platform complexity inside modular, future-oriented…

Okta

Brands · Inter

Identity-platform design with clear blue actions, neutral enterprise surfaces, and accessibility-first structure. Okta’s Odyssey system aims for consistency, efficiency, and trust across authentication, admin, and…

OnePlus

Brands · OnePlus Sans

Premium mobile technology with focused intensity. OnePlus's current public presence combines deep black and white contrast, unmistakable red brand accents, clean device photography, and a confident "Never Settle"…

OpenAI

Brands · OpenAI Sans

OpenAI's interface is the visual argument that powerful technology should feel quiet. The canvas is uncompromising near-black-on-white (#0d0d0d text on #ffffff), with the signature teal-green (#10a37f) reserved…

Opera

Brands · Inter

Browser design with red brand energy, polished product families, and expressive but controlled browsing surfaces.

Palo Alto Networks

Brands · Inter

Cybersecurity platform design with black-and-white authority, saturated brand accents, and clear enterprise hierarchy. Palo Alto Networks frames AI and security through strong contrast, large strategic statements,…

PayPay (ペイペイ)

Brands · Noto Sans JP

PayPay is Japan's dominant QR-code mobile wallet — the app that, almost single-handedly, dragged a famously cash-loving country into cashless payments. Its visual language is loud where Japanese fintech is…

PlanetScale

Brands · Inter

Database platform design with official black-and-white restraint, purple primary brand color, and clean deploy-request workflows.

Postman

Brands · Inter

API-platform design with energetic orange branding, dense product diagrams, and developer-friendly modularity. Postman’s current web and platform experience balances strong brand personality with clear, scalable…

Proton

Brands · Inter

Privacy ecosystem design with deep purple foundations, secure product clarity, and calm encrypted-service surfaces.

Qualcomm

Brands · Qualcomm Sans

Intelligent computing everywhere with enterprise-scale polish. Qualcomm's current public site blends bright white sections, deep navy framing, vivid blue-teal gradients, chip-platform product families, and clean…

Qualtrics

Brands · Poppins

Experience-management design with flexible survey styling, clean enterprise surfaces, and explicit accessibility safeguards. Qualtrics supports multiple survey layouts and palette options while keeping typography,…

Railway

Brands · Inter

Deployment platform design with dark command-center surfaces, violet infrastructure accents, and fast project-to-production workflows.

realme

Brands · realme Sans

Youth-focused technology with energetic confidence. realme's current global site combines bright yellow, black, and white with bold product imagery, confident category labels, and trend-aware collaborations to create…

Redis

Brands · Inter

Fast data-platform design with bold red identity, black technical contrast, and performance-first product framing.

Render

Brands · Inter

Cloud platform design with clean builder-first surfaces, blue production accents, and simple deploy-to-scale workflows.

Replit

Brands · ABC Diatype

Browser IDE and AI app-building design with vivid orange identity, clean coding surfaces, and practical workspace ergonomics.

RIDI (리디)

Brands · Pretendard Std

RIDI's interface is a long-form reading room dressed as a storefront. It is the rare consumer surface in Korean tech that treats typography itself as the brand — the screen opens on a near-pure white canvas (#ffffff)…

Runway

Brands · Inter

Creative AI video design with stark black-and-white brand discipline, cinematic media surfaces, and precise generation controls.

Sansan (サンサン)

Brands · Hiragino

Sansan is Japan's category-defining B2B "business card" cloud — the company that turned the ritual exchange of meishi into a structured, searchable contact graph and grew it into a sales-intelligence platform. The…

Sketch

Brands · Sketch Sans

Crafted, Mac-native design built around a warm diamond-orange accent, soft light surfaces, and precise native-feeling controls. Sketch's public brand celebrates design craft with polished product screenshots, subtle…

Snowflake

Brands · Inter

Data-platform design with cool precision and AI-era confidence. Bright glacier blue, dark cloud navies, crisp technical typography, and modular enterprise blocks create interfaces that feel powerful, modern, and…

Snyk

Brands · Inter

Developer security design with dark product confidence, bright green remediation cues, and clear vulnerability-to-fix workflows.

SoFi

Brands · Apercu

Consumer finance with a bright cyan-blue identity, rounded fintech surfaces, and benefit-led product framing. SoFi's public site uses strong teal/cyan branding, white cards, and mainstream financial product storytelling.

Sonar

Brands · Inter

Code quality and security design with clean developer dashboards, orange-blue brand energy, and issue remediation clarity.

Square

Brands · Square Sans Display

Commerce infrastructure with black-and-white precision and practical business breadth. Square's public site uses a clean sans system, sharp monochrome structure, and modest accent color while balancing payments,…

Storyblok

Brands · Inter

Headless CMS design with bright blue brand confidence, visual editing clarity, and component-based content structure.

Substack

Brands · Georgia

Publishing with literary simplicity, serif display tone, and restrained orange brand cues. Substack's public site uses a clean editorial layout, black-and-white structure, and orange accents to frame newsletters,…

Tailscale

Brands · Inter

Secure networking design with calm infrastructure clarity, friendly mesh diagrams, and low-friction admin surfaces.

Temporal

Brands · Inter

Durable execution design with dark reliability surfaces, green workflow accents, and code-first orchestration clarity.

Trello

Brands · Charlie Display

Visual task management with playful productivity and board-first clarity. Trello's public site uses a bright, approachable design language rooted in white, pale blue, bold blue gradients, rounded cards, and simple…

Tripadvisor

Brands · Trip Sans

Travel discovery with content-heavy browsing, green brand cues, and review-driven utility. Tripadvisor's public site uses white surfaces, black text, rounded search controls, and the familiar Tripadvisor green…

Turso

Brands · Inter

Edge database design with black-and-lime technical contrast, SQLite clarity, and distributed data workflows.

Other fonts