Happy New Year! Use code NEXUS26 and get 26% discount on Nexus Dashboard Template!

All daisyUI components

65 Components

Tailwind CSS Accordion component

Accordion

Accordion is used for showing and hiding content but only one item can stay open at a time.

Tailwind CSS Alert component

Alert

Alert informs users about important events.

Tailwind CSS Avatar component

Avatar

Avatars are used to show a thumbnail representation of an individual or business in the interface.

Tailwind CSS Badge component

Badge

Badges are used to inform the user of the status of specific data.

Tailwind CSS Breadcrumbs component

Breadcrumbs

Breadcrumbs helps users to navigate through the website.

Tailwind CSS Button component

Button

Buttons allow the user to take actions or make choices.

Tailwind CSS Calendar component

Calendar

Calendar includes styles for different calendar libraries.

Tailwind CSS Card component

Card

Cards are used to group and display content in a way that is easily readable.

Tailwind CSS Carousel component

Carousel

Carousel show images or content in a scrollable area.

Tailwind CSS Chat bubble component

Chat bubble

Chat bubbles are used to show one line of conversation and all its data, including the author image, author name, time, etc.

Tailwind CSS Checkbox component

Checkbox

Checkboxes are used to select or deselect a value.

Tailwind CSS Collapse component

Collapse

Collapse is used for showing and hiding content.

Tailwind CSS Countdown component

Countdown

Countdown gives you a transition effect when you change a number between 0 to 999.

Tailwind CSS Diff component

Diff

Diff component shows a side-by-side comparison of two items.

Tailwind CSS Divider component

Divider

Divider will be used to separate content vertically or horizontally.

Tailwind CSS Dock component

Dock

Dock (also know as Bottom navigation or Bottom bar) is a UI element that provides navigation options to the user. Dock sticks to the bottom of the screen.

Tailwind CSS Drawer sidebar component

Drawer sidebar

Drawer is a grid layout that can show/hide a sidebar on the left or right side of the page.

Tailwind CSS Dropdown component

Dropdown

Dropdown can open a menu or any other element when the button is clicked.

Tailwind CSS FAB / Speed Dial component

FAB / Speed Dial

FAB (Floating Action Button) stays in the bottom corner of screen. It includes a focusable and accessible element with button role. Clicking or focusing it shows additional buttons (known as Speed Dial buttons) in a vertical arrangement or a flower shape (quarter circle).

Tailwind CSS Fieldset component

Fieldset

Fieldset is a container for grouping related form elements. It includes fieldset-legend as a title and label as a description.

Tailwind CSS File Input component

File Input

File Input is a an input field for uploading files.

Tailwind CSS Filter component

Filter

Filter is a group of radio buttons. Choosing one of the options will hide the others and shows a reset button next to the chosen option.

Tailwind CSS Footer component

Footer

Footer can contain logo, copyright notice, and links to other pages.

Tailwind CSS Hero component

Hero

Hero is a component for displaying a large box or image with a title and description.

Tailwind CSS Hover 3D Card component

Hover 3D Card

Hover 3D is a wrapper component that adds a 3D hover effect to its content. When we hover over the component, it tilts and rotates based on the mouse position, creating an interactive 3D effect.

Tailwind CSS Hover Gallery component

Hover Gallery

Hover Gallery is container of images. The first image is visible be default and when we hover it horizontally, other images show up. Hover Gallery is useful for product cards in ecommerce sites, portfoilios or in image galleries. Hover Gallery can include up to 10 images.

Tailwind CSS Indicator component

Indicator

Indicators are used to place an element on the corner of another element.

Tailwind CSS Text Input component

Text Input

Text Input is a simple input field.

Tailwind CSS Join (group items) component

Join (group items)

Join is a container for grouping multiple items, it can be used to group buttons, inputs, etc. Join applies border radius to the first and last item. Join can be used to create a horizontal or vertical list of items.

Tailwind CSS Kbd component

Kbd

Kbd is used to display keyboard shortcuts.

Tailwind CSS Label component

Label

Label is used to provide a name or title for an input field. Label can be placed before or after the field.

Tailwind CSS Link component

Link

Link adds the missing underline style to links.

Tailwind CSS List component

List

List is a vertical layout to display information in rows.

Tailwind CSS Loading component

Loading

Loading shows an animation to indicate that something is loading.

Tailwind CSS Mask component

Mask

Mask crops the content of the element to common shapes.

Tailwind CSS Menu component

Menu

Menu is used to display a list of links vertically or horizontally.

Tailwind CSS Browser mockup component

Browser mockup

Browser mockup shows a box that looks like a browser window.

Tailwind CSS Code mockup component

Code mockup

Code mockup is used to show a block of code in a box that looks like a code editor.

Tailwind CSS Phone mockup component

Phone mockup

Phone mockup shows a mockup of an iPhone.

Tailwind CSS Window mockup component

Window mockup

Window mockup shows a box that looks like an operating system window.

Tailwind CSS Modal component

Modal

Modal is used to show a dialog or a box when you click a button.

Tailwind CSS Navbar component

Navbar

Navbar is used to show a navigation bar on the top of the page.

Tailwind CSS Pagination component

Pagination

Pagination is a group of buttons that allow the user to navigate between a set of related content.