CCHub Logo CCHub Tailwind Collection
Komponenten Komponenten für die Inhaltsanzeige Playful_Farming_Content_Card

Playful_Farming_Content_Card

Eine einfache, verspielte und kontrastreiche Content-Displaykarte, die sich für landwirtschaftliche und landwirtschaftliche Websites eignet, mit abgerundeten Elementen und Unterstützung für den Dunkelmodus.

Vorschau

HTML-Code 

<div class="p-4 sm:p-6 bg-green-50 dark:bg-gray-800 font-sans">
  <div class="max-w-sm mx-auto bg-white dark:bg-gray-900 rounded-3xl shadow-xl overflow-hidden transform transition-all duration-300 hover:scale-105">
    <img class="w-full h-48 object-cover" src="https://picsum.photos/400/300?random=1" alt="Farm landscape">
    <div class="p-6 text-center">
      <h3 class="text-2xl sm:text-3xl font-extrabold text-green-700 dark:text-green-400 mb-3 leading-tight">Harvesting Joy!</h3>
      <p class="text-gray-600 dark:text-gray-300 text-base leading-relaxed mb-6">
        Discover the bounty of nature with our fresh, organic produce. From farm to table, we bring you the best!
      </p>
      <a href="#" class="inline-flex items-center px-6 py-3 rounded-full bg-yellow-400 text-green-800 dark:bg-yellow-500 dark:text-green-900 font-bold text-lg shadow-md hover:bg-yellow-500 dark:hover:bg-yellow-600 transform transition-transform duration-200 hover:-translate-y-1">
        Learn More
        <svg class="ml-2 -mr-1 w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M10.293 15.707a1 1 0 010-1.414L14.586 10l-4.293-4.293a1 1 0 111.414-1.414l5 5a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0z" clip-rule="evenodd"></path><path fill-rule="evenodd" d="M4.293 15.707a1 1 0 010-1.414L8.586 10 4.293 5.707a1 1 0 011.414-1.414l5 5a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0z" clip-rule="evenodd"></path></svg>
      </a>
    </div>
  </div>
</div>

Verwandte Komponenten

Verspielte juwelenfarbene Anzeige von Fotografie-Inhalten

Eine komplexe, spielerische und unterhaltsame Komponente zur Anzeige von Inhalten für ein Fotoportfolio oder eine Fotogalerie mit hellen Juwelentönen, abgerundeten Elementen und einem responsiven Design mit Unterstützung für den Dunkelmodus. Es zeigt mehrere interaktive Elemente wie ausgewählte Bilder, Rasterlayouts und Profilabschnitte.

Offen

Komponenten für die Inhaltsanzeige

Eine reaktionsschnelle Komponente zur Anzeige von Social-Media-Inhalten, die im skeuomorphen Stil mit Pastellfarben gestaltet wurde und mehrere interaktive Elemente und Unterstützung für den Dunkelmodus bietet.

Offen

Memphis_Muted_Consulting_Content_Display

Eine Content-Display-Komponente für Beratung/Dienstleistungen, inspiriert vom Memphis-Design mit gedämpften Farben und geometrischen Mustern. Reaktionsschnell mit Unterstützung für den Dunkelmodus.

Offen