> ## Documentation Index
> Fetch the complete documentation index at: https://wiki.another-horizon.eu/llms.txt
> Use this file to discover all available pages before exploring further.

# Tabs

> Organiza el contenido con pestañas para mostrar diferentes opciones o versiones.

Usa pestañas para organizar el contenido en varios paneles entre los que los usuarios pueden alternar. Puedes agregar cualquier número de pestañas e incluir otros componentes dentro de cada una.

<Tabs>
  <Tab title="Primera pestaña">
    ☝️ Bienvenido al contenido que solo puedes ver dentro de la primera pestaña.

    Puedes agregar cualquier número de componentes dentro de las pestañas. Por ejemplo, un bloque de código:

    ```java HelloWorld.java theme={null}
      class HelloWorld {
          public static void main(String[] args) {
              System.out.println("Hello, World!");
          }
      }
    ```
  </Tab>

  <Tab title="Segunda pestaña" icon="leaf">
    ✌️ Aquí tienes contenido que solo está dentro de la segunda pestaña.

    ¡Esta tiene un <Icon icon="leaf" />!
  </Tab>

  <Tab title="Tercera pestaña">
    💪 Aquí tienes contenido que solo está dentro de la tercera pestaña.
  </Tab>
</Tabs>

````mdx Tabs example theme={null}
<Tabs>
  <Tab title="Primera pestaña">
    ☝️ Bienvenido al contenido que solo puedes ver dentro de la primera pestaña.

    Puedes agregar cualquier cantidad de componentes dentro de las pestañas. Por ejemplo, un bloque de código:
    ```java HelloWorld.java
      class HelloWorld {
          public static void main(String[] args) {
              System.out.println("Hello, World!");
          }
      }
    ```
  </Tab>
  <Tab title="Segunda pestaña" icon="leaf">
    ✌️ Aquí está el contenido que solo se encuentra dentro de la segunda pestaña.

    ¡Esta tiene un icono de <Icon icon="leaf" />!
  </Tab>
  <Tab title="Tercera pestaña">
    💪 Aquí está el contenido que solo se encuentra dentro de la tercera pestaña.
  </Tab>
</Tabs>
````

<div id="properties">
  ## Propiedades
</div>

<ResponseField name="title" type="string" required>
  El title de la Tab. Los títulos cortos facilitan la navegación.
</ResponseField>

<ResponseField name="icon" type="string">
  Un icon de [Font Awesome](https://fontawesome.com/icons), un icon de [Lucide](https://lucide.dev/icons), una URL a un icon o una ruta relativa a un icon.
</ResponseField>

<ResponseField name="iconType" type="string">
  Solo para icon de Font Awesome: Uno de `regular`, `solid`, `light`, `thin`, `sharp-solid`, `duotone`, `brands`.
</ResponseField>