Komponenten Spalten Spalten-Komponente

Spalten-Komponente

Eine Spaltenkomponente im Material Design-Stil mit responsiven Effekten und Unterstützung für dunkle Designs unter Verwendung von Tailwind CSS.

Vorschau

HTML-Code

<div class="container mx-auto px-4 py-8">
  <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
    <!-- Column 1 -->
    <div class="bg-white dark:bg-gray-800 rounded-lg shadow-md p-6">
      <h2 class="text-xl font-semibold text-gray-800 dark:text-white mb-4">Column 1</h2>
      <p class="text-gray-600 dark:text-gray-300">This is the content for column 1. It uses Material Design principles for styling and responsiveness.</p>
    </div>

    <!-- Column 2 -->
    <div class="bg-white dark:bg-gray-800 rounded-lg shadow-md p-6">
      <h2 class="text-xl font-semibold text-gray-800 dark:text-white mb-4">Column 2</h2>
      <p class="text-gray-600 dark:text-gray-300">This is the content for column 2. The columns are responsive, adapting to different screen sizes.</p>
    </div>

    <!-- Column 3 -->
    <div class="bg-white dark:bg-gray-800 rounded-lg shadow-md p-6">
      <h2 class="text-xl font-semibold text-gray-800 dark:text-white mb-4">Column 3</h2>
      <p class="text-gray-600 dark:text-gray-300">This is the content for column 3. Dark mode is supported, changing the background and text colors.</p>
    </div>
  </div>
</div>

Verwandte Komponenten

Luxury_Job_Board_Columns_Component

Eine monochromatische Spaltenkomponente für Jobbörsen und Karriereentwicklungsplattformen im Luxus-/Premium-Bereich. Es verfügt über ein ausgeklügeltes Design mit eleganter Typografie, reichhaltigen Oberflächenelementen, vollständiger Reaktionsfähigkeit und Unterstützung des Dunkelmodus.

Offen

Spalten-Komponente

Eine responsive Spaltenkomponente, die nach Material Design-Prinzipien entwickelt wurde und Tailwind CSS für das Styling, die Unterstützung dunkler Designs und reaktionsschnelle Animationen verwendet.

Offen

Spalten-Komponente

Responsive Columns-Komponente mit Glassmorphism-Stil, triadischem Farbschema, einfacher Komplexitätsstufe für Business-/Corporate-Zwecke, einschließlich Unterstützung des Dunkelmodus.

Offen