10% off on all-access. Use code SUPER10.
    d :
    h :
    m :
    Logo

    Bento Grid

    A skewed grid layout with Title, description and a header component

    The Dawn of Innovation
    Explore the birth of groundbreaking ideas and inventions.
    The Digital Revolution
    Dive into the transformative power of technology.
    The Art of Design
    Discover the beauty of thoughtful and functional design.
    The Power of Communication
    Understand the impact of effective communication in our lives.
    The Pursuit of Knowledge
    Join the quest for understanding and enlightenment.
    The Joy of Creation
    Experience the thrill of bringing ideas to life.
    The Spirit of Adventure
    Embark on exciting journeys and thrilling discoveries.

    Installation

    Run the following command

    npx shadcn@latest add @aceternity/bento-grid

    Example

    Populated with Header and Content

    AI Content Generation
    Experience the power of AI in generating unique content.
    Automated Proofreading
    Let AI handle the proofreading of your documents.
    Contextual Suggestions
    Get AI-powered suggestions based on your writing context.
    avatar

    Just code in Vanilla Javascript

    Delusional

    avatar

    Tailwind CSS is cool, you know

    Sensible

    avatar

    I love angular, RSC, and Redux.

    Helpless

    Sentiment Analysis
    Understand the sentiment of your text with AI analysis.
    avatar

    There are a lot of cool framerworks out there like React, Angular, Vue, Svelte that can make your life ....

    Use PHP.

    Text Summarization
    Summarize your lengthy documents with AI technology.

    2 Column Grid

    The Dawn of Innovation
    Explore the birth of groundbreaking ideas and inventions.
    The Digital Revolution
    Dive into the transformative power of technology.
    The Art of Design
    Discover the beauty of thoughtful and functional design.
    The Power of Communication
    Understand the impact of effective communication in our lives.

    Props

    Prop nameTypeDescription
    classNamestringThe class name of the child component.
    items{title: string, description: string, header: ReactNode, icon: ReactNode}items that you can map through, passed as props to the BentoGridItem component

    Build websites faster and 10x better than your competitors with

    Aceternity UI Pro

    Next.js 15, Tailwind CSS v4 and Motion for react powered templates

    100+ templates and blocks combined

    Ready to copy paste component blocks, save days of development time

    Aceternity UI Pro Demo - Light Mode
    Logo
    Aceternity UI

    Access an ever-growing collection of premium, meticulously crafted templates and Component Blocks.

    A product by Aceternity
    Building in public at @mannupaaji

    © 2026 Aceternity Labs LLC. All Rights Reserved.