- StackOverflow - coding questions
- Perplexity AI - AI-powered search for technical and design questions
- r/UXDesign - UX subreddit
- ADPList - Online network of mentors
- Design Slack Communities - Join one of many online Slack communities just for designers and professionals
- Product Hunt - startup culture/news/trends
- Pinterest - great for moodboards and inspo
- Dribbble - design trends for product design and web
- Behance - design trends for branding and design outside of product
- Figma Community - free files, templates, and plugins
- Designer News - design industry news and discussion
- UX Collective - curated UX articles and case studies
- Google Stitch - AI design tool by Google
- Google AI Studio - AI-first app development with built-in features like Nano Banana and Google Search
- Figma Make - AI that generates UI from text prompts inside your Figma file
- v0 by Vercel - generate production-ready React/Tailwind UI from a prompt
- Bolt.new - build and deploy full-stack apps from a text prompt
- Lovable - generate full-stack apps through conversational prompts
- Magic Patterns - generate UI component variants for your design system
- Uizard - rapid wireframe and mockup generation from text or sketches
- UXPilot - AI-powered wireframes and high-fidelity UI generation
- Galileo AI - text-to-UI design for mobile and web
-
Important must-read of things to understand in front-end dev: css resets, responsive media queries, viewport meta tag, box model, container/columns/rows best practices, clearfix
-
Front-End Frameworks:
-
Front-End Libraries:
-
Front-End Tools:
- Lipsum - placeholder text generator
- UI Faces - placeholder user avatars
- Random User Generator - fake user data API
- Animate.css - CSS3 animation library
- Pure CSS - small, responsive CSS modules
- js Beautifier
- Squoosh - browser-based image compression by Google
- Can I Use - browser support tables for CSS, HTML, and JS
- Builtwith - find out what tools any website is built with
-
Web Development Guides:
- Codrops - Innovative web development techniques and tutorials
- CSS-Tricks - guides, almanac, and front-end snippets
- freeCodeCamp - learn coding for free
- DropBox - store/sync your files/document on the cloud
- WeTransfer - easily send large files to anyone
- CodePen - explore and share code experiments
- JSFiddle - easy way to run shareable code snippets
- LiceCap - record screen activity as GIF
- Loom - async screen recording with shareable links
- ScreenToGif - screen, webcam, and sketch recorder
- Google Analytics
- MixPanel
- Hotjar - heatmaps, session recordings, and user feedback
- PostHog - open-source product analytics and session replay
- Muzli - Chrome extension for design inspiration
- JSON Formatter - clean, collapsible JSON viewer
- Panda Design Inspiration
- WhatFont - identify any font used on a webpage
- VisBug - open-source design debugger for live pages
- Polypane - browser for responsive, accessible design testing
- Mobbin - the largest and best library of mobile and web UI patterns
- Subtle Patterns - seamless background patterns
- UX Archive - documented flows from top apps
- Pttrns - mobile UI pattern gallery
- Page Flows - real user flows from real products
- Scrnshts - curated app store screenshot gallery
- UI Interaction Library
- User Onboarding Teardowns
- Android Design guidelines
- Apple Human Interface Guidelines
- Material Design 3 - Google's latest design system for Android and web
- Android tools:
- Android Asset Studio - generate icons and other assets
- PlaceIt - real-life image templates to insert mobile screens
- Rotato - 3D device mockups and screen recordings
- Figma - industry-standard design, prototyping, and collaboration
- Framer - design and publish responsive sites with advanced interactions
- ProtoPie - high-fidelity interactive prototypes without code
- Proto.io
- Penpot - open-source design and prototyping tool
- Adobe Fonts - formerly Typekit, included with Creative Cloud
- Google Fonts - free web fonts
- Fonts In Use - real-world typography examples from print, screen, and environment
- Typewolf - font inspiration, recommendations, and font of the day
- Fontpair - curated Google Fonts pairing suggestions
- v-fonts - comprehensive variable fonts guide and browser
- Utopia - fluid type scale generator for responsive typography
- Cloud Typography - professional web font hosting
- Coolors - fast color palette generator with contrast checker
- Adobe Color - color wheel, palette explorer, and trend library
- Colour Lovers - color trends and community palettes
- My Mind Color Palettes - curated color palettes by Van Schneider
- Radix UI Colors - accessible, tested color palettes for design systems
- Accessible Palette - build color systems with predictable WCAG contrast
- Huemint - AI color palette generator for brands, UI, and illustrations
- Reasonable Colors - open-source accessible color system
- Color Contrast Checker
- Style Tiles
- Webstiles - web style tiles
- Tailwind CSS - utility-first CSS framework powering most modern design systems
- shadcn/ui - copy-paste components built on Radix UI and Tailwind
- Radix UI - unstyled, accessible component primitives
- Material Design 3 - Google's open design system
- IBM Carbon Design System
- Atlassian Design System
- Storybook - UI component workshop for building and documenting components
- Zeroheight - publish and maintain design system documentation
- Supernova - sync design tokens from Figma and generate code
- Rive - real-time interactive animations for apps, games, and the web
- LottieFiles - lightweight JSON animation format for web and mobile
- ProtoPies - complex interactive prototypes with logic, variables, and sensor
- Jitter - browser-based motion design for UI and social content
- Motion One - high-performance JavaScript animation library
- Auto Animate - add smooth animations with a single line of code
- Squoosh - browser-based image compression by Google
- TinyPNG - compress PNG and JPEG without visible quality loss
- Pic Resize
- Remove.bg - AI-powered background removal
- Cleanup.pictures - remove objects, people, or text from photos with AI
- Logo Lounge
- Logopond
- Logobook - curated logo design inspiration
- I ♥ Wireframes
- Wireframe Showcase
- Excalidraw - virtual whiteboard for sketching hand-drawn diagrams
- All API Cheat Sheets
- jQuery Quick API Reference
- CSS Reference - visual guide to every CSS property
- HTML Reference - visual guide to every HTML element
- DevDocs - fast, offline-capable API documentation browser
- Complete Guide to CSS Grid - CSS-Tricks
- Complete Guide to Flexbox - CSS-Tricks
- Responsive Patterns
- FitText.js
- Media Queries Patterns Library
- PX to EM
- Utopia - fluid responsive type and space scale generator
- HTML Markup Validation (W3)
- CSS Validation (W3)
- Clean CSS
- Procssor - organize your CSS
- JavaScript Compressor
- Prettier - opinionated code formatter for JS, CSS, HTML, and more
- ESLint - pluggable JavaScript and TypeScript linter
- Treehouse
- Pluralsight - formerly CodeSchool, broad tech learning library
- LinkedIn Learning
- Codecademy
- Interaction Design Foundation - structured UX and design courses
- Google UX Design Certificate - beginner-friendly certificate program on Coursera
- Scrimba - interactive front-end coding courses
- DesignCourse - YouTube channel for UI/UX and front-end
- 52 Weeks of UX
- Hack Design
- Favicon Generator - realfavicongenerator.net
- Favicon Cheat Sheet
- Favicon.io - generate favicons from text, image, or emoji
- IconFinder
- IconArchive
- IconMonstr
- The Noun Project
- IcoMoon
- Fontello
- Font Awesome
- Lucide - beautiful, consistent open-source icons
- Phosphor Icons - flexible icon family with six weights including duotone
- Heroicons - hand-crafted SVG icons by the Tailwind CSS team
- Tabler Icons - 5000+ free open-source SVG icons
- Feather Icons - simply beautiful open-source icons
- Icônes - fast browser across multiple open-source icon sets
- Unsplash - free stock photos
- Pexels - free stock photos and videos
- Pixabay - free images, videos, illustrations, and vectors
- Compfight
- Morgue File
- Public Domain Archive
- PicJumbo
- Getty Images
- Lummis - high-quality AI-generated and human-curated free stock photo
- Maze - rapid usability testing and prototype validation
- Dovetail - qualitative research repository and analysis platform
- Hotjar - heatmaps, session recordings, and user feedback
- Optimal Workshop - card sorting, tree testing, and surveys
- Lyssna - fast remote user research and concept testing
- UserTesting - live moderated and unmoderated user research
- Canva - easy to use design templates for just about anything
- Designmodo - UI components and design freebies
- SmashingMagazine - freebies, templates, and design resources
- Freebbble - Dribbble design freebies
- Freepik - free vectors, mockups, illustrations, and PSDs
- Checklist Design - best UX and UI design practice checklists
- Design Resources for Developers - curated list by Brad Traversy
- Hack Design
- 52 Weeks of UX
Last audited: March 2026 — Removed 22 dead or deprecated links (including InVision shutdown Dec 2024, Adobe Edge Fonts discontinuation, broken mobile pattern sites). Updated 12 URLs to canonical destinations (Adobe Fonts, Adobe Color, Google Fonts, Font Awesome, Animate.css, Foundation, Apple HIG, and others). Added 55 new resources across 4 new sections (AI-Assisted Design, Design Systems & Components, Motion & Interaction Design, UX Research & Testing) and expanded 12 existing sections with modern tools including Tailwind CSS, shadcn/ui, Figma, v0, Rive, Coolors, Lucide, Phosphor, Heroicons, Pexels, and more.