Компоненты Вкладки Вкладки «Дизайн материалов»

Вкладки «Дизайн материалов»

Компонент Tabs со стилем Material Design, адаптивными эффектами и поддержкой темной темы с использованием Tailwind CSS, без JavaScript.

Предварительный просмотр

HTML-код

<div class="material-tabs">
  <div class="tab-header">
    <div class="tab-button active">Tab 1</div>
    <div class="tab-button">Tab 2</div>
    <div class="tab-button">Tab 3</div>
  </div>
  <div class="tab-content active">
    <h2>Content for Tab 1</h2>
    <p>This is the content for the first tab. It uses Material Design principles for layout and appearance.</p>
  </div>
  <div class="tab-content">
    <h2>Content for Tab 2</h2>
    <p>This is the content for the second tab.</p>
  </div>
  <div class="tab-content">
    <h2>Content for Tab 3</h2>
    <p>This is the content for the third tab.</p>
  </div>
</div>

Связанные компоненты

Компонент вкладок

Минималистичный компонент вкладок для сайтов электронной коммерции с интерактивными элементами, адаптивным дизайном и поддержкой темного режима.

Открытый

СтеклянныеОттенки серого

Glassmorphism Grayscale Простые вкладки приборной панели Компонент с поддержкой темного режима

Открытый

Компонент вкладок

Минималистичный и яркий компонент Tabs для электронной коммерции с умеренной сложностью, адаптивным дизайном и поддержкой темных тем, реализованный с помощью Tailwind CSS и HTML.

Открытый