← Collection

Best Free Design Resources

Design resources are where "free" most often means "free until you look closely." Every site below offers real professional value without a subscription — either fully free, open source, or a free tier that stands on its own. Checked and described by hand.

Figma

The industry-standard interface design tool, running entirely in the browser. The free tier allows three project files and unlimited personal drafts, which covers students, freelancers starting out, and most one-off design work. Real-time collaboration is built in rather than bolted on.

Best for: UI design and prototypes with zero installation.

Google Fonts

Over a thousand open-source typefaces, all licensed for commercial use with zero attribution required. Pairing suggestions, live type testers, and a one-line CSS embed make it the default first stop for web typography — Inter, the font this site uses, comes from here.

Best for: safe, high-quality web fonts you'll never owe anyone money for.

Fontshare

The Indian Type Foundry's free font service — professionally designed families (Satoshi, General Sans, Clash Display) that look like paid work, free for commercial use. Quality is noticeably above the average "free font" site, and the catalog is small enough to browse entirely.

Best for: display and branding fonts that don't look like everyone else's Google Fonts.

Unsplash

High-resolution photography free for commercial use under a simple license (no selling unaltered copies). The collection is curated, which is what separates it from the keyword-stuffed free-stock sites — searching "workspace" returns photos you'd actually publish.

Best for: hero images and blog photos without licensing anxiety.

Lucide

An open-source icon library (a friendly Fork of Feather) with a consistent stroke style and packages for React, Vue, Svelte, and plain SVG. Icons ship as real components with adjustable size and stroke width, which keeps icon usage clean in any framework.

Best for: interface icons that look coherent across an entire product.

LottieFiles

The hub for Lottie animations — lightweight JSON-based motion graphics that scale crisply and weigh kilobytes instead of megabytes. Free tier includes thousands of ready-made animations plus a web player to preview and tweak speed and colors before exporting.

Best for: adding polished micro-animations without hiring a motion designer.

Realtime Colors

Preview color palettes and font pairings on a realistic landing page instead of flat swatches. Paste your palette, watch a full demo site recolor live, and export the CSS variables. It catches the "looked good in the swatch, terrible on the page" problem before your users do.

Best for: validating a palette in context within five minutes.

Awwwards

A juried gallery of the web's most ambitious sites. You're not copying these — you're calibrating your sense of what's possible: motion, typography, and layout ideas that trickle down into mainstream design a year later. Browsing is free; submissions cost money.

Best for: inspiration that raises your bar instead of echoing your habits.

Working with colors? Our color palette generator and glassmorphism generator run entirely in your browser — pair them with Realtime Colors for a full design-to-code pass. Missing a great resource? Tell us.