Everything a designer needs. Open source.
Stop opening 15 design websites. Open one. Typography, color, icons and design tokens - no login, no backend, works offline.
- studios
- 15
- open source icons
- 200k+
- accounts required
- 0
- runs in your browser
- 100%
Start here
What do you want to make?
- A logoEdit your mark, check clear space and export a logo pack.
- Social imagesBanners, covers and Open Graph images for every platform.
- A brand bookA PDF or a website that explains your brand, from logo use to tokens.
- Design tokensCSS, Tailwind, JSON and more, from one set of choices.
- A color paletteHarmonies, shades and WCAG contrast in OKLCH.
- A font pairBrowse Google Fonts, pair them and build a fluid type scale.
- An iconSearch 200,000 icons, restyle one and export it.
- A backgroundWaves, patterns and textures, exported as SVG, PNG or CSS.
All 15 studios
- Brand StudioThe hub of your identity: name, logo, colors, type, radius, spacing and shadows, synced everywhere.
- Brand DNAExtract a palette, mood and type pairing from any image and apply it to your brand. Runs on your device.
- Logo StudioEdit your SVG logo, check construction and clear space, generate variants and export a logo pack.
- Mockup StudioBusiness cards, stationery, posters, websites, dashboards and apps, drawn live from your brand.
- Social Media StudioBanners, covers, OG images and thumbnails for every platform, generated from your brand.
- Brand GuidelinesA complete brand book, from logo usage to design tokens, generated from your brand and exported as PDF.
- Brand ProjectsKeep several brands side by side. Everything saves locally in your browser; import and export as JSON.
- Typography StudioBrowse Google Fonts, pair typefaces and generate fluid type scales.
- Color StudioGenerate palettes, shades and gradients. Check contrast in OKLCH.
- Icon StudioSearch 200,000+ open source icons. Restyle and export to SVG, React, PNG or ICO.
- Background StudioProcedural waves, blobs, mesh gradients, aurora, noise and patterns. Export SVG, PNG or CSS.
- Effects LabGlass, neumorphism, layered and inner shadows, glows, gradient borders and grain - as CSS and Tailwind.
- SVG PlaygroundInspect, edit and optimize SVG. Convert to JSX, React, React Native, Vue, Svelte, Angular, Solid, Qwik, Lit, Astro or a sprite sheet.
- Accessibility LabWCAG contrast, color vision simulation, readability, dyslexia preview and touch-target checks.
- Export EngineTurn your choices into design tokens for CSS, SCSS, Tailwind, React and JSON.
Principles
Built like the tools you already love.
Fast, quiet and respectful of your data - inspired by Linear, Raycast and Vercel.
Open source
MIT licensed. Fork it, extend it, self-host it.
Local first
Favorites, palettes and tokens live in IndexedDB on your device.
No login
No accounts, no email, no paywall. Open the tab and work.
No backend
Nothing you make leaves your browser. There is no server to leak it.
Offline first
Color, type scale and export tools work without a connection.
Keyboard first
⌘K for everything, G-shortcuts to jump, space to shuffle palettes.
Production ready
Exports drop straight into CSS, SCSS, Tailwind v4 and React.
Dark & light
Carefully tuned themes that respect your system preference.
Built in the open. Shaped by designers.
DesignHub is community driven. Star the repo, open an issue, or ship the next studio on the roadmap.