Reusable React Typescript Components with TailwindCSS and Shadcn

Start exploring the types of components we have available and visit their individual pages where you can find the web components and their source code. Make sure you have checked out the configuration page. Your setup should be similar, otherwise some components might not work as expected in your project.

Snippets

Primary
Secondary

Button Groups

Sections with multiple buttons with different layouts and functionalities.

Get Started

CTA Sections

Diversely styled sections to appeal the user to click on them.

Headers

Command-like bars for editor/tooling surfaces (undo/redo, actions).

Learn More

Hero Sections

Opening sections to amaze and impress the user.

Revenue
$24.5k
+12%
Users
2,543
+8%

KPI Widgets

Key Performance Indicators to show the user the most important metrics.

Navbars

Header navigation bars with dropdowns, search, and mobile drawers.

Product Cards

Views for product listing entries with different styles and purposes.

Timelines

Chronological event blocks with variants for icons, avatars, and steppers.

Components

Alerts

Customizable alerts to send information to the user.

New
Success
Warning
Error

Badges

Small badges for signaling short pieces of information.

Primary
Secondary
Destructive
Ghost

Buttons

Button components with different styles, animations and purposes.

Checkboxes

Checkboxes for selecting one or multiple options.

Color Pickers

Color pickers for selecting colors within different scenarios.

Dropzones

Dropzones for receiving data from the user.

Headings

Customizable and expansible top menu components.

Inputs

Input components for receiving data from the user.

Loading

Components for informing the user that data is loading.

Modals

Modal dialogs for displaying information or prompting the user for action.

Selects

Accessible and fancy dropdown components for selecting one or multiple options.

Selects Multi

Custom select-multi built on shadcn primitives with bubbles and search.

Sidebars

Customizable and expansible side menu components.

Sliders

Interactive sliders for selecting a value from a range.

Switches

Toggle between two states with our customized switches with different styles and purposes.