Skip to main content
Use tabs to organize content into multiple panels that users can switch between. You can add any number of tabs and include other components inside each tab.
  • First tab
  • Second tab
  • Third tab
☝️ Welcome to the content that you can only see inside the first tab.You can add any number of components inside of tabs. For example, a code block:
HelloWorld.java
  class HelloWorld {
      public static void main(String[] args) {
          System.out.println("Hello, World!");
      }
  }
Tabs example
<Tabs>
  <Tab title="First tab">
    ☝️ Welcome to the content that you can only see inside the first tab.

    You can add any number of components inside of tabs. For example, a code block:
    ```java HelloWorld.java
      class HelloWorld {
          public static void main(String[] args) {
              System.out.println("Hello, World!");
          }
      }
    ```
  </Tab>
  <Tab title="Second tab" icon="leaf">
    ✌️ Here's content that's only inside the second tab.

    This one has a <Icon icon="leaf" /> icon!
  </Tab>
  <Tab title="Third tab">
    💪 Here's content that's only inside the third tab.
  </Tab>
</Tabs>

Properties

title
string
required
The title of the tab. Short titles are easier to navigate.
icon
string
A Font Awesome icon, Lucide icon, URL to an icon, or relative path to an icon.
iconType
string
For Font Awesome icons only: One of regular, solid, light, thin, sharp-solid, duotone, brands.