Pixel Perfect UI — Lightweight UI Library for React
pixel-perfect.space · 267 words · saved by 1 readers
A lightweight, documentation-first UI library for React with bespoke components, animations, and effects you can copy, paste, and ship.
How the Gooey Effect Works The gooey effect uses an SVG filter chain with three primitives. Each one plays a critical role. Toggle them individually to see their contribution in the live preview. 1 feGaussianBlur Applies a Gaussian blur of 5px to the entire source graphic. This softens the edges of both the button and the "+" circle so they bleed into each other when close, creating the raw material for the gooey merge. <feGaussianBlur in="SourceGraphic" stdDeviation="5" result="blur" /> → Toggle off to see: without blur, there's nothing soft for the color matrix to sharpen, so the…
saved by
related reading
- Shadersshaders.com
- Paper Shaders – Ultra-fast zero-dependency shadersshaders.paper.design
- Chloe's Gardenchloeyan.me
- Online Image & Video Effect Generator – Free | Effect.appeffect.app
- Liquid metal — Animated metal shader effectmetal.jakubantalik.com
- Components | Canvas UIcanvasui.dev
- Libraries.dev: High-crafted UI libraries for AI agentslibraries.dev
- ui.sh — Agent skills for interface buildersui.sh
- UI Skills for Design Engineers | UI Skillsui-skills.com
- performative-ui | AI-native React Componentsvorpus.github.io
- Magic UImagicui.design
- DESIGN.md Examples for AI Agents | Refero Stylesstyles.refero.design