Sonu kumar

Dashboard with Collapsible Sidebar

Cards 2.4K

About

This React code implements a dashboard with a collapsible sidebar featuring various options, a dark mode toggle, and displays various statistics and recent activity. It uses Lucide-React for icons and manages a dark/light theme via CSS class manipulation.

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

Code

How Dashboard with Collapsible Sidebar is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { Example } from "@/components/ui/dashboard-with-collapsible-sidebar";

export default function DemoOne() {
  return <Example />;
}

Dependencies

More by Sonu kumar

View all
  • Modern Hero

    Modern Hero

    1.4K
  • Text Parallax Content (scroll)

    Text Parallax Content (scroll)

    1.2K
  • About Us section

    About Us section

    1.2K
  • Modern Animated Hero Section

    Modern Animated Hero Section

    1.1K
  • Animated Hero Section

    Animated Hero Section

    689
  • Cuisine Selector Chips

    Cuisine Selector Chips

    585
  • Bounce card features

    Bounce card features

    573
  • Futurastic Hero Section

    Futurastic Hero Section

    485

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