0xUrvish

Bento Card

Cards 1.1K

About

An interactive bento card with animated tabs and workspace preview.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Bento Card to your project and fits it to your theme.

Code

How Bento Card is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

"use client";
import BentoCard from "@/components/ui/bento-card";

export default function Demo() {
  return (
    <div className="flex items-center justify-center w-full min-h-screen bg-background p-8">
      <BentoCard />
    </div>
  );
}

Dependencies

More by 0xUrvish

View all
  • Feature Carousel

    Feature Carousel

    2.7K
  • Vertical Tabs

    Vertical Tabs

    1.5K
  • Bucket

    Bucket

    889
  • Stacked List x

    Stacked List x

    885
  • Fluid Expanding Grid

    Fluid Expanding Grid

    784
  • Magnified Bento

    Magnified Bento

    750
  • Pricing Card

    Pricing Card

    719
  • Expandable Gallery

    Expandable Gallery

    622

More in Cards

View all
  • Statistics Card 2

    Statistics Card 2

    264
  • Course Design Cards

    Course Design Cards

    1.1K
  • Card

    Card

    70
  • Stats cards with links

    Stats cards with links

    39
  • The Item one

    The Item one

    3
  • Card Studio

    Card Studio

    7
  • Statistics Card 7

    Statistics Card 7

    292
  • Item

    Item

    10