# [Usage](../../../usage.md) > [Components](../basics.md) > [Visuals](../basics.md) > Tabs

Tabbed container for splitting complex pages into switchable sections sharing one layout. Use it when sections are peer views (details, settings, history); use [Fieldset](fieldset.md) for stacked form groups and [Card](card.md) for a single standalone section.

![image](img/tabs_1.png)

```php
{!!
\KFramework\Components\Visual\Tabs::make()
    ->setSchema([
         \KFramework\Components\Visual\Tab::make()
             ->setName('Tab 1')
             ->setSchema([
                \KFramework\Components\Visual\Tabs::make()
                    ->setSchema([
                        \KFramework\Components\Visual\Tab::make()
                            ->setName('Subtab 1')
                            ->setSchema([
                                \KFramework\Components\Forms\Input::make()
                            ]),
                        \KFramework\Components\Visual\Tab::make()
                            ->setName('Subtab 2')
                            ->setContent('Example text for sub tab 2')
                    ]),
            ]),
         \KFramework\Components\Visual\Tab::make()
              ->setName('Tab 2')
              ->setContent('Example text for tab 2')
         ])
!!}
```

**End-to-end example:** user profile with form and history tabs.
```php
// Blade:
{!!
\KFramework\Components\Visual\Tabs::make()
    ->setSchema([
         \KFramework\Components\Visual\Tab::make()->setName('Profile')->setSchema([
             \KFramework\Components\Forms\Input::make('name')->setLabel('Name'),
         ]),
         \KFramework\Components\Visual\Tab::make()->setName('History')->setContent('No recent activity.'),
        ])
!!}

// Controller:
use KFramework\Components\Visual\Tab;
use KFramework\Components\Visual\Tabs;
use KFramework\Components\Forms\Input;

$tabs = Tabs::make()->setSchema([
    Tab::make()->setName('Profile')->setSchema([Input::make('name')->setLabel('Name')]),
    Tab::make()->setName('History')->setContent('No recent activity.'),
]);

return view('users.show', compact('tabs'));
```

---
## Usage

- Blade:
```php
{!! 
    \KFramework\Components\Visual\Tabs::make()
        ->setSchema([
            \KFramework\Components\Visual\Tab::make()
        ])
!!}
```
- Controller:
```php
Tabs::make()
    ->setSchema([
        Tab::make()
    ])
```

---
## Tabs: standard attributes

- `uuid`
- `id`
- `classes`
- `extraAttributes`
- `style`
- `schema` — list of `Tab` components rendered as tab panes.
- `values`
- `defaults`
- `columnSpan`

See their usage and description [here](../basics.md).

---
## Tab: standard attributes

- `uuid`
- `id`
- `classes`
- `extraAttributes`
- `style` — inline CSS applied to the tab pane (`overflow`, `max-height` for scrollable panes).
- `name` || `label`
  - This will set the name/label of the tab. `label` overrides `name` in display. If no name or label is set, the tab will be simply called `Tab` followed by the tab number.
- `schema`
- `content` — static pane body; replaced when `schema` holds nested components.
- `values`
- `defaults`
- `columns`
- `columnSpan`

See their usage and description [here](../basics.md).

## See also
- [Components basics](../basics.md)
- [Card](card.md), [Fieldset](fieldset.md), [Form](../forms/form.md)
- [schema](../shared_attributes/schema.md), [content](../shared_attributes/content.md), [columns](../shared_attributes/columns.md)
