VayuUI

Components

Collection of pre-built components for Vayu UI.

Welcome to the Vayu UI Component Library.

Overview

Vayu UI provides a set of accessible, performant, and customizable components built with React and Tailwind CSS.

Available Components

Accordionclient

A vertically stacked set of interactive headings.

Affixclient

Fix an element to the viewport.

Alertserver

Displays a callout for user attention.

Animationserver

Ready-to-use animation components.

Aspect Ratioserver

Displays content within a desired ratio.

Audio Playerclient

A custom audio player component.

Avatarclient

An image element with a fallback for representing the user.

Badgeserver

displays a badge or a component that looks like a badge.

Big Calendarclient

A full-sized calendar component.

Breadcrumbserver

Displays the path to the current resource.

Buttonserver

Displays a button or a component that looks like a button.

Button Groupserver

Group a series of buttons together.

Cardserver

Displays a card with header, content, and footer.

Carouselclient

A slideshow component for cycling through elements.

Caseserver

Conditional rendering component.

Checkboxclient

A control that allows the user to toggle between checked and not checked.

Collapsibleclient

An interactive component which expands/collapses a panel.

Color Pickerclient

A component for selecting colors.

Comboboxclient

Autocomplete input and command palette.

Command Boxclient

Fast, composable, unstyled command menu.

Context Menuclient

Displays a menu to the user — such as a set of actions or functions — triggered by a button.

Date Time Pickerclient

A date and time picker component.

Dividerserver

Visually or semantically separates content.

Draggable Listclient

A list that can be reordered via drag and drop.

Drawerclient

A drawer component for side content.

File Uploaderclient

A component for uploading files.

Footerserver

A footer component.

Headerserver

A header component.

Hover Cardclient

For sighted users to preview content available behind a link.

Labelserver

Renders an accessible label associated with controls.

Linkserver

A link component.

Logoclient

The brand logo component.

Mapclient

A map component.

Marqueeclient

A scrolling marquee component.

Menubarclient

A visually persistent menu common in desktop applications.

Modalclient

A window overlaid on either the primary window or another dialog window.

Navbarserver

A navigation bar component.

OTP Inputclient

An accessible one-time password input component.

Paginationserver

Pagination with page navigation, next and previous links.

Popoverclient

Displays rich content in a portal, triggered by a button.

QR Codeserver

A QR code generator component.

Radio Groupclient

A set of checkable buttons—known as radio buttons.

Rateclient

A rating component with star icons.

Resizableclient

Accessible resizable panel groups and layouts.

Role Guardserver

A component to guard content based on user roles.

Selectclient

Displays a list of options for the user to pick from.

Showserver

A component for conditional rendering.

Sidebarserver

A sidebar navigation component.

Skeletonserver

Use to show a placeholder while content is loading.

Sliderclient

An input where the user selects a value from within a given range.

Spinnerserver

A loading spinner component.

Switchclient

A control that allows the user to toggle between checked and not checked.

Tabclient

A set of layered sections of content—known as tab panels.

Tableserver

A responsive table component.

Textareaclient

A textarea component.

Text Inputclient

A text input component.

Time Pickerclient

A time picker component.

Timelineserver

A timeline component.

Toasterclient

A toast notification component.

Tooltipclient

A popup that displays information related to an element.

Tourclient

A guided tour component.

Treeclient

A tree view component.

Typographyserver

Styles for headings, paragraphs, lists, etc.

Video Playerclient

A custom video player component.

On this page