Components

drop in.
customize. ship.

$
npx shadcn@latest add @rayyan/bookshelf

Available Components

New

Bookshelf

An interactive shelf with book spines and expanding covers.

New

Fluid testimonial card

A testimonial card with a flowing gradient and hover lift.

Emoji reactions

A reaction picker with spring feedback and saved selections.

Todo list

Task rows that animate completed items to the bottom.

Theme switcher

Light, dark, and system themes with visual previews.

Prompt Bar

A prompt input with context chips and send, stop, and retry states.

Ask AI

Send a prompt to your AI provider from a compact popover.

Model Picker

Choose a model from a list filtered by provider.

Glyph Card

A card that gathers tiny marks into a glyph on hover.

Command Palette

A keyboard command menu with nested pages and recent actions.

Progress Bars

Textured bar charts with line or dot fills and tooltips.

Section Rail

Section navigation with scroll tracking and hover previews.

Interactive Project Explorer

Year folders with project status badges and image previews.

Dotted World Map

An SVG world map with dots colored by your data.

Copy Command Block

Copy install commands with saved package manager preferences.

Interactive Skill Cloud

Draggable skill pills that fall, collide, and bounce.

GitHub Heatmap

A contribution calendar with themed colors and date tooltips.

Fluid Carousel

A spring carousel with touch, keyboard, and pagination controls.

Contact Channels

A contact grid with copy actions and keyboard shortcuts.

Mode Toggler

A compact theme toggle with an optional click sound.

Workflow Status

Workflow badges with custom states, icons, and colors.

Snake

A dot-grid snake game with keyboard and swipe controls.

Stack Rolodex

A rotating pill stack with depth and edge fading.

Supported by

The soul becomes dyed with the color of its thoughts.

Marcus Aurelius

Made with <3 and lots of coffee.