Tabs

A set of layered sections of content—known as tab panels—that are displayed one at a time.

Source code

Click here to see the source code for this component on GitHub. Feel free to copy it and adjust it for your own use.

Installation

npx ui-thing@latest add tabs

Usage

Basic example

Account

Make changes to your account here. Click save when you're done.

Name

Username

With Indicator

Passing :pill="false" to the List and Trigger components will remove the background color from both components. This allows us to use the Indicator component to create a custom indicator.

Account

Make changes to your account here. Click save when you're done.

Name

Username

Origin UI Examples

These are some examples that I found today over here Origin UI. I think they are cool.

To use these examples you will have to copy the code and adjust it for your own use.

One

Content for Tab 1

Two

Content for Tab 1

Three

Content for Tab 1

Four

Content for Tab 1

Five

Content for Tab 1

Six

Content for Tab 1