Curated directory of reusable UI, accessibility, motion, and frontend-craft skills for design engineers and coding agents.

Animation learning and reference site for improving UI motion and frontend animation craft.

Ahmad Shadeed's articles on CSS, layout, responsive design, accessibility, and front-end UI engineering.

Design education resource with practical lessons about layout, visual hierarchy, typography, and product UI.

Educational reference for learning SVG fundamentals, syntax, shapes, paths, and web usage.

Comprehensive paid course for learning Three.js, WebGL, shaders, and browser-based 3D experiences.

Curated resource directory for UI design, frontend craft, inspiration, assets, and tools.

UX and UI checklist resource for validating common design patterns, flows, and interface states.

Interface-design learning and reference resource focused on practical UI craft and product-design quality.

Research and pattern resource focused on AI user-interface conventions, AI UX behaviors, and emerging interaction models.

Reference wiki for interface patterns, UI terminology, behavior, and product-design concepts.

General reference category for hand-drawn, sketchy, low-fidelity interface aesthetics and UI treatments.

Pattern and visual-system playground for exploring decorative backgrounds and geometric design ideas.

Online front-end playground and community for HTML, CSS, JavaScript, creative coding, and UI experiments.

Curated website and interaction-design gallery emphasizing high-quality digital aesthetics.

Awards platform and gallery showcasing high-quality web design, digital experiences, and agency work.

Gallery focused on bento-grid landing-page and dashboard layout inspiration.

Visual discovery and inspiration platform for saving, organizing, and exploring references.

Craftwork's curated collection of notable website designs and visual references.

High-end web design inspiration gallery focused on polished, contemporary websites.

Design-inspiration collection for browsing and saving interface and visual references.

Curated gallery of websites, landing pages, portfolios, and product pages for design inspiration.

Landing-page inspiration gallery for modern startup, SaaS, and product marketing websites.

Landing-page and component inspiration gallery for SaaS, startup, and marketing pages.

Curated landing-page inspiration gallery for product, startup, and SaaS websites.

Large landing-page and website inspiration gallery with examples across product categories and styles.

Portfolio inspiration gallery for designers, developers, studios, and creative professionals.

Gallery of SaaS landing pages organized for marketing, conversion, and interface inspiration.

Visual inspiration and moodboard platform for saving images, references, and design ideas.

Curated resource directory for UI design, frontend craft, inspiration, assets, and tools.

Animation inspiration and reference resource for improving micro-interactions and motion design craft.

Prompt-inspiration resource for Nano Banana and related AI image-generation workflows.

Color palette extraction tool for generating color schemes from a website URL or visual reference.

AI-native design canvas where agents can inspect layers, modify designs in real time, and work with JSX/Tailwind design primitives.

Developer platform and API marketplace for running fast generative media models for images, video, audio, and related AI workflows.

Node-based creative AI workspace for image, video, and multimodal generation workflows on an infinite canvas.

AI video and creative-generation platform for producing stylized clips, camera moves, and image-to-video outputs.

AI image and video generation platform known for text-to-video, image-to-video, and animation workflows.

Open-source node-based workflow editor for AI media generation on an infinite canvas.

AI image-generation, editing, and remixing tool with natural-language edits and a visual creative workspace.

Figma's node-based AI workflow tool for generating images, video, and creative assets using prompts, layered controls, and model pipelines.

AI-native design canvas where agents can inspect layers, modify designs in real time, and work with JSX/Tailwind design primitives.

Declarative Agent-to-UI protocol for letting AI agents describe and render native, interactive user interfaces.

Desktop coding-agent tool oriented toward reviewing, fixing, and improving AI-generated or vibe-coded frontend work.

AI landing page builder for generating polished landing pages quickly with export options for HTML and Figma.

Production-focused AI design and prototyping tool that treats working code as the source of truth for design iteration.

AI app builder for building, deploying, and monetizing apps from chat prompts, with built-in forms, payments, analytics, and integrations.

Google AI tool for generating web and mobile UI designs from prompts or images and exporting frontend code.

Generative UI framework for rendering safe, predictable, component-based interfaces from JSON generated by prompts or agents.

AI-native landing-page design editor focused on creating on-brand, studio-grade marketing pages with generation and manual control.

AI design agent for creating cohesive brand, layout, visual, and marketing design assets from prompts.

Collaborative AI design and prototyping workspace where humans and agents edit components and round-trip changes to code.

AI builder for creating 3D scenes, websites, games, apps, and interactive experiences from natural-language descriptions.

Agent-driven MCP design canvas that lets teams design near the codebase, import from Figma, and generate production-aligned UI.

AI mobile app designer that generates editable iOS and Android mockups from prompts or reference images and exports to Figma or code.

AI-powered design tool for creating, iterating, and exporting production-ready interface designs from natural-language prompts.

Generative AI design exploration tool that produces many UI and visual directions for a product idea.

Schema-aware, embeddable visual JSON editor useful for editing structured UI, configuration, and agent-generated interface data.

AI-assisted product design canvas for generating designs, making precise edits, and working with code context.

Desktop coding-agent tool oriented toward reviewing, fixing, and improving AI-generated or vibe-coded frontend work.

Visual feedback tool that turns clicked UI annotations into structured context that AI coding agents can understand and act on.

Agent-oriented template or skill for cloning, studying, and recreating website layouts and interaction patterns.

OpenAI coding agent and software-engineering assistant for reading, editing, testing, and reasoning about codebases.

Developer documentation context service that gives coding agents and IDEs current library docs and usage examples.

AI-first code editor for assisted editing, repo understanding, chat, and agentic code changes.

Reusable motion-design skill or guide for helping agents audit and improve interface animation quality.

AI software-development platform that provides autonomous agents for engineering workflows and codebase work.

Google AI-assisted development environment and coding-agent workflow for planning, editing, and validating software changes.

Open-source terminal coding agent for delegating software engineering tasks to AI models in a local development workflow.

Automated design-review service for AI-generated frontend code that flags visual bugs, accessibility issues, and UI quality problems.

Developer tool that copies selected React UI elements into source-aware context for AI coding agents.

Directory and tooling hub for discovering, installing, and sharing reusable agent skills.

Curated directory of reusable UI, accessibility, motion, and frontend-craft skills for design engineers and coding agents.

Vercel's agent-skills documentation and library for giving agents structured, secure workflows across web projects and deployments.

Frontend context and UI-to-code helper for selecting or inspecting interface elements and passing better context to agents.

Schema-aware, embeddable visual JSON editor useful for editing structured UI, configuration, and agent-generated interface data.

Developer documentation context service that gives coding agents and IDEs current library docs and usage examples.

AI-first code editor for assisted editing, repo understanding, chat, and agentic code changes.

Developer tool that copies selected React UI elements into source-aware context for AI coding agents.

Frontend context and UI-to-code helper for selecting or inspecting interface elements and passing better context to agents.

Browser-based font inspection and interception tool for discovering and experimenting with fonts used on websites.

Theme editor and generator for shadcn/ui that customizes colors, typography, and layout tokens with live preview.

Online front-end playground and community for HTML, CSS, JavaScript, creative coding, and UI experiments.

Cloud development environment and online editor for prototyping, sharing, and building web applications.

Performance-focused JavaScript and React tooling project for making UI rendering faster.

React debugging and diagnostic tool for identifying performance, rendering, and architecture issues.

Developer tool for detecting React performance issues and unnecessary renders in applications.

Responsive design browser and developer tool for previewing sites across multiple devices and breakpoints.

Upload component and tooling library for building better file-upload experiences in web applications.

Generative ASCII cloud/background effect by Caidan Williams using procedural patterns and typographic texture.

2D-to-3D logo maker for converting flat logos or marks into stylized 3D assets and previews.

Gradient and texture resource offering animated gradients, grainy textures, and AI-generated backgrounds.

Background pattern and gradient snippet generator for modern CSS and Tailwind projects.

SVG background generator and pattern library for creating lightweight decorative website backgrounds.

Reference bucket for CodePen-based ASCII, dithering, shader, and post-processing visual effects.

Hand-drawn styled Bootswatch theme for Bootstrap interfaces.

Low-level JavaScript data visualization library for binding data to the DOM and creating custom charts and graphics.

CSS stylesheet for giving HTML elements a hand-drawn, doodle-like appearance.

Useful helpers, abstractions, and ready-made components for react-three-fiber projects.

Apache charting and visualization library for interactive dashboards, maps, and large-scale data graphics.

WebGPU-powered tool for real-time ASCII, dithering, grain, and retro image/video effects.

General reference category for hand-drawn, sketchy, low-fidelity interface aesthetics and UI treatments.

2D rigid-body physics engine for JavaScript games, interactive demos, and playful web interfaces.

Motion-graphics JavaScript library for shape bursts, micro-interactions, and custom UI animation effects.

Grammar-of-graphics plotting library for quickly building exploratory and publication-quality data visualizations.

Design tool and shader-oriented visual resource for adding generative, textured, and animated surface effects to web work.

Vector graphics scripting framework for working with paths, geometry, drawing, and animation on Canvas.

Pattern and visual-system playground for exploring decorative backgrounds and geometric design ideas.

Fast 2D rendering engine for interactive graphics, games, particles, and Canvas/WebGL experiences.

React renderer for Three.js that lets developers build 3D scenes declaratively with React components.

Composable React charting library for building line, bar, area, pie, and other charts from data.

3D design and collaboration tool for creating interactive web scenes and embeddable 3D content.

JavaScript 3D and WebGL library for rendering interactive 3D graphics in the browser.

Theme editor and generator for shadcn/ui that customizes colors, typography, and layout tokens with live preview.

2D drawing API for SVG, Canvas, and WebGL renderers with a focus on shape-based animation.

Interactive visual and 3D website-effects tool for creating animated scenes and immersive web sections.

Airbnb's low-level visualization primitives for composing custom React data visualizations with D3 utilities.

Set of hand-drawn, sketchy Web Components for playful UI controls and layouts.

Pseudo-3D JavaScript engine for simple, stylized, flat-shaded 3D illustrations and animations.

React-based framework for programmatically creating, rendering, and automating videos.

Interactive vector animation editor and runtime for state-machine-driven animations in apps, games, and websites.

React and Tailwind dashboard component system for charts, analytics, and data-heavy interfaces.

Reusable motion-design skill or guide for helping agents audit and improve interface animation quality.

Motion-graphics JavaScript library for shape bursts, micro-interactions, and custom UI animation effects.

Animation learning and reference site for improving UI motion and frontend animation craft.

Declarative JavaScript library for triggering CSS animations with HTML-style syntax.

Ready-to-use CSS animation library with common entrance, exit, attention, and transition effects.

Lightweight JavaScript animation engine for CSS properties, SVG, DOM attributes, and JavaScript objects.

JavaScript library for animated page transitions and smooth navigation between views.

Small UI transition utility for creating smooth shared-element and morphing transitions.

Professional-grade JavaScript animation platform for complex timelines, scroll effects, SVG animation, and performant UI motion.

Collection of CSS hover effects for buttons, links, logos, SVGs, and featured UI elements.

Browser-based motion design tool for creating animated UI, product, and social media graphics.

Smooth-scroll library for creating fluid, modern scrolling interactions on the web.

Animation format and platform for discovering, editing, hosting, and embedding lightweight vector animations.

Open-source animated React icon set built with Lucide icons and Motion.

Animation inspiration and reference resource for improving micro-interactions and motion design craft.

Modern JavaScript and React animation library, evolved from Framer Motion, for gestures, layout animation, and UI motion.

Low-level JavaScript motion and animation primitives for building custom animation systems.

Spring-physics animation library for React applications and interactive UI transitions.

React-based framework for programmatically creating, rendering, and automating videos.

Interactive vector animation editor and runtime for state-machine-driven animations in apps, games, and websites.

JavaScript library for easily animating elements into view as users scroll.

Typography animation engine for creating smooth, creative, and sequential text animations on the web.

JavaScript library for typewriter-style animated text effects.

Open-source animated React component distribution with animated primitives, components, and icons.

Open-source animated UI primitives for adding high-quality motion to React and Tailwind interfaces.

Gesture-recognition hooks for adding drag, pinch, wheel, scroll, and hover interactions to React interfaces.

Color palette extraction tool for generating color schemes from a website URL or visual reference.

Free 3D icon collection for product interfaces, presentations, and marketing visuals.

Generative ASCII cloud/background effect by Caidan Williams using procedural patterns and typographic texture.

Directory of free fonts and typefaces for branding, editorial, UI, and web design projects.

Illustration platform for customizing, mixing, and downloading illustration packs from artists.

Fast color palette generator and color-scheme exploration tool for designers.

Browser-based font inspection and interception tool for discovering and experimenting with fonts used on websites.

Typography pairing inspiration and free font combination resource for web and brand design.

Free font service and type foundry collection with high-quality fonts for commercial and personal design projects.

2D-to-3D logo maker for converting flat logos or marks into stylized 3D assets and previews.

Gradient and texture resource offering animated gradients, grainy textures, and AI-generated backgrounds.

Consistent, lightweight SVG icon library for web and product interfaces.

Free hand-drawn illustration set with sketchy, playful people and object scenes.

Hand-drawn illustration library of people and characters for interfaces, presentations, and storytelling.

Background pattern and gradient snippet generator for modern CSS and Tailwind projects.

Large professional icon, illustration, emoji, and asset library for product and brand design.

SVG background generator and pattern library for creating lightweight decorative website backgrounds.

Large collection of playful 3D icons and object illustrations for product and marketing design.

Open-source illustration collection with customizable color accents for websites and product UI.

Visual discovery and inspiration platform for saving, organizing, and exploring references.

Visual inspiration and moodboard platform for saving images, references, and design ideas.

Animation format and platform for discovering, editing, hosting, and embedding lightweight vector animations.

Open-source animated React icon set built with Lucide icons and Motion.

Consistent, lightweight SVG icon library for web and product interfaces.

Set of hand-drawn, sketchy Web Components for playful UI controls and layouts.

Community marketplace and gallery for discovering, copying, remixing, and publishing React components.

Minimal UI component collection for React and Tailwind projects.

Copy-paste UI components, blocks, and templates built with React, Next.js, Tailwind CSS, and motion effects.

Personal design-engineering resource and component collection associated with modern React/Tailwind UI examples.

Open-source animated React component distribution with animated primitives, components, and icons.

Design resource and component collection for modern web interfaces.

Accessible Astro and Tailwind component library for content-heavy and application-style websites.

Upload component and tooling library for building better file-upload experiences in web applications.

UI component collection for React, Tailwind, and modern application interfaces.

Curated collection of handcrafted Tailwind, React, and shadcn/ui-compatible components and UI blocks.

Copy-paste React and Tailwind component collection, commonly referred to as Origin UI.

shadcn-style component, block, and template collection with animated interface patterns.

React UI component library and design system for building accessible, themeable applications.

Tailwind and shadcn-style component collection with ready-to-use UI blocks and patterns.

Animated React and Tailwind component collection for polished landing pages, SaaS sites, and marketing interfaces.

Open-source animated UI primitives for adding high-quality motion to React and Tailwind interfaces.

Modern UI component collection for building polished React and Tailwind interfaces.

Collection of animated React components, effects, and interaction snippets for modern interfaces.

Copy-and-customize component system built with Radix UI and Tailwind CSS rather than a traditional packaged component library.

shadcn-compatible component collection focused on uncommon, polished, and animated UI components.

Copy-paste UI component collection for modern React and Tailwind interfaces.

Component collection for building colorful, modern application and landing-page interfaces.

Ready-made Tailwind UI blocks and landing-page sections for quickly assembling marketing pages.

React and Tailwind dashboard component system for charts, analytics, and data-heavy interfaces.

Gallery of responsive UI layout patterns, component sections, and implementation examples.

Curated UI component and layout collection for modern web product interfaces.

Community library of copy-paste HTML, CSS, and UI snippets including buttons, loaders, cards, and effects.

Animated React layout and component patterns for quickly composing product pages and interface sections.

React and Next.js component library focused on stylish, uncommon UI components and blocks.

React component library and hooks collection for building accessible, production-ready applications.

Accessibility-focused React hooks and components for building robust design systems and UI primitives.

Ahmad Shadeed's articles on CSS, layout, responsive design, accessibility, and front-end UI engineering.

Content-focused web framework for building fast websites with islands architecture and flexible frontend integrations.

Lightweight library for building standards-based Web Components.

React component library and hooks collection for building accessible, production-ready applications.

React framework for server-rendered, static, hybrid, and full-stack web applications.

Next.js-based framework for documentation sites, blogs, and MDX-powered content projects.

Accessibility-focused React hooks and components for building robust design systems and UI primitives.

Fine-grained reactive JavaScript UI library for building high-performance web interfaces.

Utility-first CSS framework for rapidly composing custom user interfaces directly in markup.

Gesture-recognition hooks for adding drag, pinch, wheel, scroll, and hover interactions to React interfaces.

Small, flexible state-management library for React and vanilla JavaScript applications.

UX and UI checklist resource for validating common design patterns, flows, and interface states.

Interface-design learning and reference resource focused on practical UI craft and product-design quality.

Product UI and screen reference library covering mobile and web applications across many categories.

User-flow and product-screen library for studying onboarding, checkout, permissions, and other real app experiences.

Product screen and flow reference library for researching UX patterns, layouts, and real interface decisions.

Research and pattern resource focused on AI user-interface conventions, AI UX behaviors, and emerging interaction models.

Reference wiki for interface patterns, UI terminology, behavior, and product-design concepts.

Curated interface reference gallery for studying product screens, layouts, and UI decisions.