Volver a Agent Skills
Frontend y Diseño
Progressive Blur
por Julien Thibeaut (ui-skills.com) 3.7k Estrellas en GitHub
Create layered CSS progressive (gradient) blur using stacked backdrop-filter masks for depth and softness at a viewport edge.
#css#backdrop-filter#blur#depth
Claude Code Codex
Descripción General
Progressive Blur builds a stepped, gradient blur overlay from an edge of the screen using multiple backdrop-filter layers with masks. It's the effect behind fading nav bars and soft content edges seen on modern sites, done purely in CSS.
Para qué sirve
- Fading a sticky header edge softly
- Gradient blur overlays over imagery
- Softening the bottom of scrollable content
- Adding depth to overlays
Instalar
Instalar en Claude Code
# Add the marketplace, then install the skill in Claude Code:
/plugin marketplace add ibelick/ui-skills
/plugin install progressive-blur
# Or install manually into ~/.claude/skills:
git clone https://github.com/ibelick/ui-skills.git
cp -r ui-skills/progressive-blur ~/.claude/skills/progressive-blurExplora herramientas de IA
Las mejores herramientas de IA que complementan tus habilidades
Lee artículos sobre IA y diseño
Consejos y tendencias en el mundo del diseño y la IA
Skills Relacionados
Frontend y Diseño
Frontend Design
Create distinctive, production-grade frontend interfaces that avoid generic AI aesthetics — pages, components, artifacts, and posters.
Claude Code Codex
Frontend y Diseño Web Artifacts Builder
Construct complex, multi-component HTML artifacts for Claude.ai using React and Tailwind.
Claude Code Codex
Frontend y Diseño Animation Systems
Product-grade web motion like Stripe, Linear, Apple, and Vercel — easing/duration defaults, choreography, performance, and reduced-motion.
Claude Code Codex