Bento 05

A four-card studio bento on a masked dot field. Each card is a Figma gradient export carrying its own glass fill and 16px border; an ambilight sampled from the artwork blooms behind the grid as the section scrolls through, and the cards ris.

Library

D2Studio UI

Framework

React

Type

component

License

MIT

Dependencies

cobe@^0.6.4, lucide-react, motion

Install

npx shadcn@latest add https://d2studio.dev/r/bento-05.json

Files

• registry/default/components/bento-05.tsx
• registry/default/components/bento-05/bento-05.css
• registry/default/components/bento-05/card-art-1.tsx
• registry/default/components/bento-05/card-art-2.tsx
• registry/default/components/bento-05/card-art-3.tsx
• registry/default/components/bento-05/card-art-4.tsx
• registry/default/components/bento-05/card-glow.tsx
• registry/default/components/bento-05/flat.tsx

Source

https://github.com/rajaaltus/d2studio-ui

Categories

• Bento Grid Components
• React Bento Grid Components
• Tailwind CSS Bento Grid Components
• Card Components
• React Card Components
• Tailwind CSS Card Components
• Data Display Components
• React Data Display Components
• Tailwind CSS Data Display Components
• Feature Card Components
• React Feature Card Components
• Tailwind CSS Feature Card Components

More from D2Studio UI

• AI Block
• AI Content Creator Card
• AI Content Creator Card v2
• AI Writing Assistant
• Bento 01
• Bento 02
• Bento 03
• Bento 04
• Block 01
• Card
• Product Card
• D2 Card