Schede di Material Design
Componente Tabs con stile Material Design, effetti reattivi e supporto per temi scuri utilizzando Tailwind CSS, senza JavaScript.
Codice 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>
Componenti correlati
Componente Schede
Componente Schede reattive con toni della terra e microinterazioni per siti Web aziendali, che supporta la modalità oscura utilizzando Tailwind CSS. Utilizza solo le classi HTML e Tailwind.
Schede di progettazione dei materiali Componente
Un componente di schede complesso e monocromatico ispirato al Material Design per le dashboard, con design reattivo, supporto per la modalità oscura ed elementi interattivi. Utilizza layout basati su griglia e sottili effetti di ombra.
Componente Art Deco News Tabs
Un componente complesso, reattivo e lussuoso in stile "Art Déco" progettato per siti Web di notizie e giornalismo, con motivi geometrici, colori analoghi ricchi e supporto per la modalità scura. Fornisce più elementi interattivi per la navigazione dei contenuti.