NEWSaaS Dashboard KitAI-ready from day one →

Blocks Library

90+ Blocks.

Composed sections you drop into a page — sidebars, metric cards, modals, full screens. 34 web + 56 React Native — fully typed, dark-mode native, with live previews.

MITTypeScriptTamaguiTailwind v4Dark-first
34 live demos
Layout

Sidebar

Collapsible navigation sidebar with groups, icons, badges, and responsive behavior.

#navigation#sidebar#nav
Layout

Kanban

Drag-and-drop kanban board for task management with multi-column layout controls.

#board#dnd#tasks
Input

Bulk Actions

Floating action bar that appears when rows are selected, with configurable actions.

#table#selection#actions
Input

Filters

Composable filter builder with text, select, and number filter types.

#filter#table#query
Input

Command Bar

Keyboard-driven command bar (⌘K) with grouped actions, search, and shortcuts.

#keyboard#search#cmdk
Input

Toggle Button

Segmented toggle button group for exclusive or multi-select mode switching.

#toggle#segment#select
Layout

Chat Detail

Full-featured messaging UI with thread view, reactions, and file attachments.

#messaging#chat#inbox
Layout

App Shell

Sidebar + main layout with mobile trigger, collapse, and responsive behavior.

#navigation#sidebar#shell
Layout

Sidebar (Minimal)

Minimal sidebar shell — just nav links, no extra chrome.

#sidebar#navigation#minimal
Layout

Sidebar (Groups)

Sidebar shell with grouped section headings for larger nav trees.

#sidebar#navigation#groups
Layout

Sidebar (User)

Sidebar shell with user profile footer — avatar, name, and account actions.

#sidebar#navigation#user
Layout

Sidebar (Search)

Sidebar shell with embedded search input above the nav links.

#sidebar#navigation#search
Data

Metric Card

Self-contained KPI card block with trend, icon, and comparison period.

#kpi#chart#block
Display

Task Card

Rich task item with priority, assignee, due date, and labels.

#task#pm#jira
Display

Messages Card

Compact message thread preview card with avatar and unread count.

#chat#notifications
Feedback

Invite Modal

Team invite modal with role selector and email input.

#team#invite#modal
Layout

Workspace Members

Team member management with roles, permissions, and invite actions.

#team#members#settings
Display

Integration Card

Third-party service integration card with connected/disconnected toggle.

#integration#settings#api
Layout

User Menu

Authenticated user dropdown with profile, settings, and sign-out.

#auth#navigation#user
Display

File Cards

File/document preview card grid with type icon, size, and metadata.

#file#media#storage
Layout

Sortable Task List

Drag-to-reorder task list with status, priority, and assignee per row.

#task#dnd#list
Layout

Stacked Tabs Shell

App shell variant with horizontal top-tab navigation instead of a sidebar.

#shell#tabs#navigation
Layout

Branded Tabs Shell

Top-nav app shell with branded logo bar — for marketing-flavored dashboards.

#shell#brand#navigation
Layout

Notification Settings

Notification preferences screen with grouped channels and per-event toggles.

#settings#notifications
Feedback

Feedback Modal

Send-feedback modal with category selector and optional screenshot attachment.

#modal#feedback#support
Layout

Manage Tags

Tag manager modal with create, rename, recolor, and delete operations.

#tags#settings#crud
Input

Select Users

Multi-user picker with search, avatar previews, and selected chips.

#users#picker#multi-select
Layout

Org Menu

Organization / workspace switcher dropdown with avatar, name, and create-new.

#org#switcher#navigation
Input

Roles Menu

Role assignment dropdown with descriptions and current-role check.

#roles#permissions#menu
Display

Files List

Compact file list view with type icons, size, and last-modified — sibling to file-cards grid.

#files#list#storage
Input

Floating Action Button

Anchored floating action button with optional expanding actions menu.

#fab#action#cta
Input

FAB Theme Picker

Floating theme switcher button — palette swatches and dark/light toggle.

#fab#theme#picker
Data

Gantt

Project timeline visualizer with drag-move + drag-resize bars, dependency arrows, progress, and grouped rows.

#gantt#timeline#pm
Input

Rich Editor

Tiptap-based WYSIWYG editor with full toolbar, bubble menu, slash commands, tables, and markdown shortcuts.

#editor#tiptap#wysiwyg

Showing 34 of 34 web blocks · live preview available