---
name: "@creative-ui"
slug: "creative-ui"
description: "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."
category: "Icons/logos"
tags: ["blocks", "icons", "media"]
framework: "react"
license: "MIT"
author: "krutikkkkkkkkk"
website: "https://ui.krutikraut.com"
github: "https://github.com/krutikkkkkkkkk/creative-ui"
registry: "https://ui.krutikraut.com/r/registry.json"
pro: false
pro_url: null
github_stars: 25
component_count: 10
generated_at: "2026-10-27T06:34:08.542Z"
---

# @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.

## Links

- Website: https://ui.krutikraut.com
- GitHub: https://github.com/krutikkkkkkkkk/creative-ui
- Registry JSON: https://ui.krutikraut.com/r/registry.json
- Directory page: https://sh4dcn.netlify.app/registry/creative-ui
- This file: https://sh4dcn.netlify.app/md/creative-ui.md

## Install

```sh
# add the whole registry (shadcn CLI)
npx shadcn@latest add https://ui.krutikraut.com/r/registry.json
pnpm dlx shadcn@latest add https://ui.krutikraut.com/r/registry.json
bunx shadcn@latest add https://ui.krutikraut.com/r/registry.json
# clone the source repo
git clone https://github.com/krutikkkkkkkkk/creative-ui.git
# fetch the raw registry index
curl -s https://ui.krutikraut.com/r/registry.json
```

## Components (10)

| name | type | description | install |
| --- | --- | --- | --- |
| halftone-image | registry: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-overlay | registry: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` |
| collage-frame | registry: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-image | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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` |

## For AI agents

```text
You are adding components from @creative-ui to a shadcn-compatible project.
1. Read this file (https://sh4dcn.netlify.app/md/creative-ui.md) for the component list.
2. Fetch the machine-readable index: https://ui.krutikraut.com/r/registry.json
3. Install a single component with its install command from the table above.
4. Full structured record: https://sh4dcn.netlify.app/json (library slug: creative-ui).
```