Design Library

Interface libraries, motion experiments, graphics tools, and other design resources I’ve collected along the way.

• Arc UIAnimated React components and blocks.
• AnimataAnimated React components, including text effects and typography.
• ComponentryInteractive effects for React interfaces.
• OriginkitAnimated components for websites.
• Aceternity UIReact components with expressive motion.
• BeUIAnimated React components.
• coss uiAccessible components built on Base UI.
• MantineReact components and useful hooks.
• UiverseOpen-source UI elements.
• PanelUIReact Native UI for AI interactions.
• AstryxReact and StyleX components, themes, and tools for coding agents.
• Beautiful UIInterface patterns for AI agents.
• Extend UIReact components for document apps.
• ToolcraftBuilding blocks for design applications.
• GSAPJavaScript animation tools.
• Anime.jsTimelines, scrolling, and SVG animation.
• Liquid GooeyLiquid effects and bouncy transitions.
• fireworks-jsCustomizable fireworks effects.
• Micro-interactionsSmall animations for everyday UI.
• Dot MatrixDot-matrix loaders for React.
• Thinking OrbsAnimated orbs for AI activity states.
• Scroll MaskAnimated fades for scroll containers.
• Libraries.devVisual effects packaged for coding agents.
• LottieFiles Motion SystemTools for consistent product motion.
• Paper ShadersShader effects and animated backgrounds.
• shadcn.io ShadersWebGL shader components for React.
• Shaders.comShader presets for visual effects.
• MetalForgeShaders for SwiftUI and React Native.
• vgpuWebGPU tools for shader rendering.
• PixiJSFast, interactive 2D graphics.
• Flutter SceneReal-time 3D rendering for Flutter.
• Three.js TSLA guide to Three.js Shader Language.
• Building GlassHow to build liquid-glass effects.
• Trophy UIStreaks, achievements, and leaderboards.
• mapcnReact maps with shadcn styling.
• TiptapCustom editors with collaboration and AI.
• Driver.jsProduct tours and contextual guidance.
• Tabler IconsOpen-source SVG icons.
• HugeiconsIcons for interface design.
• Icon CreatorCreate animated and 3D icons.
• Design Engineer ToolsTools for design, motion, and the web.
• Codrops Creative HubCode and design experiments from the creative web.
• Oil MotionAn AI skill for interactive animations.
• WayframeAn AI studio for animated stories.
• SwishyAI-assisted motion design.
• OpenUIAn open standard for generative UI.
• In The Pocket GuidelinesGuidelines for UX, accessibility, and product design.
• MotionsitesAI prompts for animated hero sections.
• Design & Animation Engineering ToolsSkills for animation review and prototyping.
• DembrandtExtract and audit design tokens.
• OpenDesignAgent-driven design workflows.
• AutoDesignImprove design agents through feedback.
• Paper + ConductorDesign-to-code workflows with AI agents.
• Vercel DesignVercel’s design team and resources.
• DESIGN.md ExtractorTurn website styles into design instructions.
• Design System GlossaryKey terms and concepts in design systems.
• Apple Human Interface GuidelinesA reference to Apple’s interface guidelines.
• SparkbitesWeb design inspiration for you and your AI tools.
• GrainientGradients, animated backgrounds, and shaders.
• Interface CraftInterface-design lessons, interactive examples, and references by Josh Puckett.
• Transitions.devUI transition recipes, text effects, and AI tools for motion design.
• EDITKITAnimation timing, easing, and alignment tools for After Effects and Premiere Pro.
• Skecher UIAnimated React components with live previews and shadcn CLI installation.
• PlanesAnimated React components with editable Tailwind and Motion source.
• Space UIInteractive UI components, shaders, templates, and creative tools.
• DesigneerCurated design tools, interface galleries, and design engineering reading.
• AI for Designers and EngineersA course on using AI to build useful interfaces, taught by Emil Kowalski.
• Aleksei LarionovDesign engineer portfolio featuring native AI apps and product interface work.
• DesEngs InspirationCurated websites from designers, studios, product teams, and cultural institutions.
• ArtCraftCompose scenes, pose characters, and stage AI image and video generation.
• Ludo.aiGenerate game sprites, animations, 3D models, textures, and audio.
• SolidCraftOpen-source parametric 3D CAD with constrained sketches and agent control.
• AnatomyGenerate interactive isometric illustrations that explain machines and technical ideas.
• PeleRender Mermaid diagrams as SVG with CSS-based colors and typography.
• ArchifyTurn ideas, plans, and codebases into interactive HTML diagrams.
• ImpeccableDesign skills and commands for auditing, refining, and polishing AI-built interfaces.
• Remix IconConsistent outlined and filled icons with SVG, PNG, icon-font, and framework options.
• LucideCustomizable SVG icons with adjustable strokes, searchable categories, and framework packages.
• Accessibility ToolsResearch-backed accessibility testing tools, documentation, and guidance for designers.
• Design VocabularyA design vocabulary reference covering typography, color, layout, motion, accessibility, and UI copy.
• Icons8 Glyph NeueFilled icons for interfaces, presentations, and visual communication, available in SVG and PNG.
• Chánh Đại ComponentsA shadcn registry of interactive components, motion effects, and interface details.
• UltramockCreate device mockups, product images, and animated showcases from screenshots and recordings.
• MobbinStudy shipped app screens, user flows, and interaction patterns from real products.
• Colorist ArchiveExplore artists’ palettes, color profiles, and how their use of color evolves.
• Bklit UIChart and data visualization components installed through the shadcn registry.
• Animate UIAdd animated primitives to existing Radix UI, Base UI, and React Aria interfaces.
• React BitsAnimated React components, text effects, interactive backgrounds, and shaders.
• Fonts NinjaDiscover typefaces, identify fonts on websites, and find similar alternatives.
• Words of TypeAn illustrated encyclopedia of typography, letter anatomy, and type design terminology.
• Physically BasedReference material and lighting values for physically based rendering.
• QuiverAIGenerate, edit, vectorize, and animate SVG graphics, logos, icons, and illustrations.
• before.clickApp Store screenshot, onboarding, paywall, and icon references from iPhone and Mac apps.
• Dirty Little ZineMake a printable eight-page folded zine with photos, captions, and JPG or PDF export.
• Really Good EmailsCurated email design inspiration for newsletters, onboarding, launches, and campaigns.
• RemotionCreate and render videos and motion graphics with React, data, and interactive editing tools.
• Book of ShapesExplore and customize minimal generative SVG patterns, grids, flows, and geometric forms.
• TegakiTurn fonts and text into handwriting animations with framework integrations and SVG output.
• Noun ProjectSearch creator-made icons and icon sets, with SVG/PNG downloads and design-app integrations.
• SquintsSquints is a free Chrome extension that brings Figma-style measuring, color picking, font inspection, grid overlay, and animation scrubbing tools to any live web page for design engineers.
• The Iconography EncyclopediaA browsable encyclopedia of 121 icon design terms with interactive illustrations, covering construction, composition, expression, meaning, and systems for icon designers.
• AtelierPixel-art and animation tools for AI agents.
• SeeCodeCreate animated, explorable diagrams from JSON.
• KineticsInterface animation examples with CSS and React snippets.
• Oil UIExplore UI directions and refine designs with AI agents.
• SUPRA-TexGenerate textured 3D assets from images, or texture existing meshes.
• IP as LogoAn agent skill for creating simple, rounded mascot concepts.
• AlephExplore and capture geographic imagery, terrain, buildings, and 3D data.
• dot/matrix60 animated 5×5 dot-matrix loaders for spinners, progress, status, and agent states, available as standalone SVGs and a React component.
• affectUISingle-file React components, screens, blocks, illustrations, and motion effects for AI agent products and SaaS, with copy-paste and shadcn CLI installation.