The Vibeary — round-ups
Best-of round-ups
32 opinionated lists pulled from the library: the tools worth bookmarking for a specific job, with the criteria that got them there and a note on why each one earned its place. Every entry links to its gem page, its shelf and its source.
Design tools and generators
Generators and utilities that replace an afternoon of fiddling.
Best free gradient generators
Hand-picked gradient generators for CSS, SVG and mesh gradients — free, browser-based, and copy-paste ready.
Best SVG background generators
Free SVG generators for waves, blobs, patterns, dividers and section shapes — tuned in the browser, exported as clean SVG.
Best colour palette tools and references
Palette generators, colour-scale builders and the reference writing that explains how to pick UI colour that actually works.
Best typography tools for the web
Type scales, font pairing tools, variable-font playgrounds and free typeface sources for web and product design.
Best mockup and screenshot tools
Tools for turning raw screenshots into presentable product shots: device frames, browser mockups, backgrounds and social cards.
Best free icon sets
Open-source and free icon libraries with consistent grids, multiple weights and licences you can actually ship.
Interface and components
What to build the actual product out of.
Best shadcn/ui extensions and blocks
Component packs, blocks and registries that extend shadcn/ui with everything the base library deliberately leaves out.
Best form and input libraries
Form builders, validation, input masks, pickers and complex field components that survive real product requirements.
Best email and notification component libraries
Component libraries for transactional email, plus in-app toasts, notification centres and inbox UI.
Best React Native UI kits and animation libraries
Component kits, animation libraries and haptics for React Native apps that need to feel native, not web-in-a-shell.
Best CSS loaders and spinners
Copy-paste CSS loaders, spinners and skeleton patterns that communicate progress without adding a dependency.
Best public design systems to learn from
Open, well-documented design systems worth reading end to end — components, tokens, accessibility and governance.
Motion, effects and 3D
The layer that makes a page feel alive.
Best web animation libraries
Animation engines and motion libraries for the web — timelines, springs, layout transitions and gesture-driven motion.
Best scroll animation and scrollytelling tools
Scroll-driven animation libraries, pinning and parallax tools, and scrollytelling frameworks for narrative pages.
Best text animation and type effect tools
Text animation libraries, kinetic typography and CSS type effects for headlines that carry a page.
Best CSS background and glass effects
Liquid glass, particle backgrounds, patterns and modern CSS demos you can copy into a page in minutes.
Best shader resources and learning material
Shader collections, GLSL learning resources and references for building GPU-side visuals on the web.
Best Three.js and WebGL resources
Three.js helpers, WebGL learning resources and 3D tooling for building interactive scenes on the web.
Best creative coding frameworks
Frameworks and toolkits for generative art, canvas sketching and procedural visuals on the web.
Data, dev and architecture
Charts, diagrams, sync and the unglamorous tooling that ships work.
Best charting libraries for the web
Charting engines and D3 plugins for dashboards, analytics and data-heavy interfaces — picked by what they render well.
Best diagram-as-code tools
Text-based diagramming tools for architecture, flows and sequence diagrams that live in version control.
Best local-first and sync engines
Sync engines, CRDT libraries and local-first databases for apps that stay fast offline and collaborate in real time.
Best developer utilities for shipping faster
Type-safe TypeScript helpers, build and DX CLIs, visual QA tools and the small packages that remove a day of work.
Best open-source SaaS boilerplates and starters
SaaS boilerplates and AI app starters with auth, billing and multi-tenancy already wired — free and open source.
AI, agents and workflow
Tooling for building with coding agents rather than around them.
Best MCP servers for design and development
Model Context Protocol servers that connect coding agents to design tools, browsers, docs and real systems.
Best AI agent skills and skill collections
Agent skill collections, design-judgment skills and workflow packs that measurably improve coding-agent output.
Best Figma plugins and tooling
Figma plugins, API tooling, design-to-code bridges and the alternatives worth knowing if you are leaving Figma.
Games, media and reference
Assets, engines and the galleries worth returning to.
Best web game engines
Browser game engines and frameworks for 2D and 3D games, from tiny jam-sized libraries to full editors.
Best public domain image and media archives
Public domain and openly licensed image, illustration and video archives with licences you can actually verify.
Best free audio and sound effect libraries
Free music, sound effects and game audio libraries with clear licensing for products, games and video.
Best pixel art and dithering tools
Pixel art editors, retro tooling and dithering utilities for lo-fi visuals that still look deliberate.
Best UX pattern libraries and inspiration galleries
Pattern libraries, UI galleries and micro-interaction collections for looking up how good products solve a problem.