shadcnblocks

Text Alignment Menu using shadcn ContextMenu with submenus.

Spell Check Menu using shadcn ContextMenu.

Font and Style Menu using shadcn ContextMenu with submenus.

Contribution graph blocks styled with custom data-level colors.

Minimal contribution graph without footer count or legend.

Contribution graph with larger block size and margin.

GitHub-style full-year contribution calendar in a compact rectangle.

An advanced bottom-left cookie card that expands upward to show category switches.

An advanced bottom-left cookie card that opens a customize dialog with category switches.

An advanced bottom-right cookie card that expands upward to show category switches.

An advanced bottom-right cookie card that opens a customize dialog with category switches.

A full-width bottom cookie panel with category switches visible by default plus bulk actions.

A full-width bottom cookie panel with a grid of category cards and switches already visible.

A wide bottom cookie panel with summary copy on one side and visible category switches on the other.

A centered popup cookie dialog with consent copy and reject plus accept actions.

A centered cookie dialog that reveals category switches when customize is opened.

A centered advanced cookie dialog with category switches visible on load plus bulk actions.

A fixed bottom cookie bar with short consent copy plus reject and accept actions.

A fixed bottom cookie bar with title, supporting text, a privacy link, and reject plus accept actions.

A fixed bottom cookie bar with a cookie icon, consent copy, and reject plus accept actions.

A simple bottom-left floating cookie card with consent copy and reject plus accept actions.

A bottom-left cookie card with dismiss control, consent copy, and a single accept action.

A simple bottom-right floating cookie card with consent copy and reject plus accept actions.

A bottom-right cookie card with a privacy link and reject plus accept actions.

An advanced bottom cookie bar that slides up to reveal category switches when customize is opened.

An advanced bottom cookie bar that opens a centered dialog with category switches when customize is selected.

A button that copies a string to the clipboard and swaps to a check icon for two seconds.

Animated counter with plus/minus buttons and sliding number transition.

Counter button starting at 5 with custom min/max bounds.

Counter button with outline/secondary styling.

Counter button with outline/secondary styling.

Counter button with outline/secondary styling.

Counter button with outline/secondary styling.

Counter button with outline/secondary styling.

Counter button with outline/secondary styling.

A minus and plus control that increments a number with a vertical slide animation between min and max.

Heart toggle button with animated count and color change.

Like toggle counter with outline/secondary styling.

Like toggle counter with outline/secondary styling.

An inline highlight that darkens on hover, sweeps beams, and fills the box with sparkle particles.

Credit card back with magnetic stripe, expiry, and CVV fields.

Credit card front with EMV chip detail and provider logo.

Complete card front with chip, number, name, expiry, and provider logo.

Credit card that flips on hover to reveal front and back faces.

Front-facing card styled for Mastercard with provider branding.

Front-facing Visa card with card number and provider logo.

Contained CTA band with headline, supporting text, and optional primary and secondary actions aligned inline on larger breakpoints and stacked when space is tight.

Card-style split with an image column, inline icon beside the heading, supporting copy, and one text link-style primary action with a trailing arrow icon.