Dashboard Shell 01 - Analytics Dashboard Shell
A full featured admin dashboard layout with sidebar navigation, KPI cards, charts, tables, and widgets, perfect for building modern SaaS, CRM, or business analytics applications.
src/components/shadcn-space/blocks/dashboard-shell-01/page.tsx
import AppSidebar from "@/components/shadcn-space/blocks/dashboard-shell-01/app-sidebar";
import StatisticsBlock from "@/components/shadcn-space/blocks/dashboard-shell-01/statistics";
import SalesOverviewChart from "@/components/shadcn-space/blocks/dashboard-shell-01/sales-overview-chart";
import EarningReportChart from "@/components/shadcn-space/blocks/dashboard-shell-01/earning-report-chart";
import TopProductTable from "@/components/shadcn-space/blocks/dashboard-shell-01/top-product-table";
import SalesByCountryWidget from "@/components/shadcn-space/blocks/dashboard-shell-01/salesbycountrywidget";
export default function Page() {
return (
<AppSidebar>
<div className="grid grid-cols-12 gap-6 p-6 max-w-7xl mx-auto">
<div className="col-span-12">
<StatisticsBlock />
</div>
<div className="xl:col-span-8 col-span-12">
<SalesOverviewChart />
</div>
<div className="xl:col-span-4 col-span-12">
<EarningReportChart />
</div>
<div className="xl:col-span-8 col-span-12">
<TopProductTable />
</div>
<div className="xl:col-span-4 col-span-12">
<SalesByCountryWidget />
</div>
</div>
</AppSidebar>
);
}
- Where it goes
- statssidebardashboard-shelldata-tablekanbanfeature-grid
- Interaction
- animated-counter
- Use cases
- dashboard
DependenciesBundle weight · medium
- icons
- lucide-react
- animation
- motion
More from Shadcnspace Figma Kit
About Us 01 - Impact MetricsblockAbout Us 02 - About the Platform with StatsblockAbout Us 03 - Experience & Impact About UsblockAbout Us 04 - Lifestyle Showcase About SectionblockAbout Us 05 - Platform OverviewblockAbout Us 06 - Minimal About UsblockAbout Us 07 - Business GrowthblockAbout Us 08 - Marketing Agency About Sectionblock
Browse all components in this library →