@creative-ui

Creative components and Claude Code skills by Krutik Raut. Install UI blocks or drop a full design skill into .claude/skills with one shadcn command.

10 components react shadcn-cli MIT

website ↗ github ↗ registry ↗ agent brief (.md) ↗

Install this registry

shadcn (npm) npx shadcn@latest add https://ui.krutikraut.com/r/registry.json

pnpm pnpm dlx shadcn@latest add https://ui.krutikraut.com/r/registry.json

bun bunx shadcn@latest add https://ui.krutikraut.com/r/registry.json

fetch registry curl -s https://ui.krutikraut.com/r/registry.json

Components

10 total

Halftone Image component

Renders any image as a print-style dot, line or square halftone on a canvas, with controls for dot size, screen angle, ink colour, contrast and inversion. Expo…

npx shadcn@latest add https://ui.krutikraut.com/r/halftone-image.json

Grain & Paper Overlay component

A lightweight, pointer-transparent film grain, paper or fibre texture you can drop on any section or fix over the whole page. SVG noise, optional tint and flic…

npx shadcn@latest add https://ui.krutikraut.com/r/grain-overlay.json

Masked Collage Frame component

Image cut-outs as an arch, oval, torn paper or museum frame, with a tilt and an overlay slot for layering a modern UI card on top of a classical picture.

npx shadcn@latest add https://ui.krutikraut.com/r/collage-frame.json

Duotone & Print Filter component

Two-ink colour treatment for photos in the spirit of risograph and screen prints: seven ink presets or any two colours, a mix slider and optional misregistrati…

npx shadcn@latest add https://ui.krutikraut.com/r/duotone-image.json

Classical Collage Web Design (Claude skill) item

Use when designing or building a website, landing page, Framer template, pitch visual or brand system in the "classical painting × modern tech" art direction (…

npx shadcn@latest add https://ui.krutikraut.com/r/classical-collage-web-design.json

DNA Carousel component

A cinematic 3D image carousel where cards travel along two intertwined helix strands. Drag, swipe, scroll or use the arrow keys, with momentum, snapping, infin…

npx shadcn@latest add https://ui.krutikraut.com/r/dna-carousel.json

Dithering Hover component

Any image turns into a black-and-white Bayer dither under the cursor. The dithered zone follows the pointer with a ragged rim and radial streaks that break up …

npx shadcn@latest add https://ui.krutikraut.com/r/dithering-hover.json

Rotunda Carousel component

Square images and videos arranged on a spinning ring, largest at a focus angle and tapering to small tiles opposite it. Auto-spins in either direction, eases t…

npx shadcn@latest add https://ui.krutikraut.com/r/rotunda-carousel.json

Image Trail component

Moving the pointer leaves a trail of images behind it. Each card rises under the cursor, tilts with the direction of travel, hangs for a moment and drifts away…

npx shadcn@latest add https://ui.krutikraut.com/r/image-trail.json

Lasting Logo Design (Claude skill) item

Use when someone gives a brand name and wants brand nouns, logo concept directions or AI logo prompts (Figma AI, ChatGPT, Midjourney, Ideogram), or wants help …

npx shadcn@latest add https://ui.krutikraut.com/r/lasting-logo-design.json