CP Registry
Pattern-Katalog

Bewaehrte Block-Kombinationen

Statt einzelne Components zu suchen — fertige Patterns als Werkstatt-Konfig laden. Tarifseite, Service-Page, Newsroom: ein Klick und du bist drin.

Komplette Seiten

Vollständige Seitentypen — Hero bis Footer

Tarifseite

Hero + Tabs nach Kundengruppe + Tarif-Karten + Preis-Tabelle + Slider mit Vorteilen + FAQ + Conversion-CTA. Vollwertige Marketing-Landingpage.

VerkehrsbetriebTicketsConversion

Service-Landingpage (Mobilitätsberatung)

Hero + Problem + Bild-Text + Schritt-für-Schritt + Testimonial-Slider + Tabelle + FAQ + Conversion-CTA. Für einzelne Dienstleistungen wie Mobilitätsberatung, Lastenrad-Förderung, Fahrradparkhaus.

ServiceLandingpageConversion

Kontaktseite

Hero + Drei Kontakt-Wege + OEffnungszeiten-Tabelle + Themen-Wegweiser + Notfall-Alert + Formular + Anfahrt. Service-Klassiker.

KontaktServiceStandort

Newsroom / Aktuelles

Hero + Top-Story + News-Grid mit 6 Stories + Pagination + Themen-Filter (Tabs) + Newsletter-CTA. Pressebereich oder Magazin-Sektion.

NewsMagazinPresse

Wissen / Erklär-Seite

Long-Form-Erklärung mit Heading-Hierarchie, Inhaltsverzeichnis, Bild-Text-Wechsel, Tabelle, Zitat, Downloads. Für Fördergelder, Mobilitätswende, Klimaticket-Erklärungen.

Long-formWissenErklärung

Über-uns / Team

Hero + Mission + StatCounter-Wand + Bild-Text-Geschichte + Team-Vorstellung + Werte + Image-Gallery + Karriere-CTA. Profilseite Premium.

TeamWerteUnternehmen

Karriere / Stellenanzeige

Hero + Eckdaten-Tabelle + Aufgaben + Tabs (Anforderungen/Tagesablauf/Team) + Benefits-Grid + Bewerbungs-Prozess + Testimonial + Kontakt-CTA. Recruiting Premium.

KarriereRecruitingStellenanzeige

Event / Veranstaltung

Hero mit Datum + StatCounter (Besucher/Programm/Angebote) + Bild-Text + Programm-Tabs + Vortragende + Bilder-Gallery + Anmelde-Formular. Komplettes Marketing.

EventVeranstaltungAnmeldung

Unternehmens-Startseite

Hero + StatCounter-Wand + Service-Trio + Slider + News-Teaser + Tabs (Privat/Gewerbe/Kommunal) + Image-Text + Testimonial-Slider + Newsletter-CTA. Vollwertige Homepage.

StartseiteHomepageMarketing

Sektion-Patterns

Kleinere Bausteine, in jede Seite einsetzbar

Hero + CTA-Section

Vollbild-Hero plus passende CTA-Banner-Sektion. Klassischer Above-the-fold-Block für Landingpages.

HeroCTALandingpage

StatCounter-Wand

Heading + Lead + vier animierte KPI-Counter. Für Glaubwürdigkeit per Fakten — Homepage, Über-uns, Pitch-Sektionen.

StatCounterKPIVertrauen

Drei-Service-Block

Heading + Lead + drei thematische Service-Cards mit Tag. Für Uebersichten von Leistungen, Tarifen oder Bereichen.

ServicesKarten-GridÜbersicht

Tabs-Sektion (Zielgruppen-Switcher)

Heading + Tabs (Privatkunden / Gewerbe / Industrie). Für Tarif- oder Service-Differenzierung nach Zielgruppe.

TabsZielgruppenDifferenzierung

Slider-Sektion (Story-Slider)

Heading + Lead + Image-Slider mit Story-Slides. Für Bürger-Anlagen-Storys, Vorher-Nachher, Highlights.

SliderStoriesHighlights

Testimonial-Reihe

Heading + drei Kunden-Stimmen mit Foto. Sozialer Beweis für Vertrauen.

QuoteTestimonialVertrauen

FAQ-Block (Accordion)

Heading + Lead + Accordion mit häufigen Fragen + Kontakt-CTA.

FAQSupportErklärung

Bild-Text-Story

Heading + zwei Bild-Text-Blöcke im Wechsel. Für Vorher-Nachher, zwei Perspektiven, oder Storytelling.

Image-TextStoryWechsel

Drei-Schritte-Prozess

Heading + drei nummerierte Schritte mit Beschreibung + abschliessender CTA. Für Wechsel, Antrag, Beratungs-Ablauf.

ProzessErklärungConversion

Bild-Galerie mit Intro

Heading + Lead + 6er-Bilder-Grid. Für Werks-Einblicke, Event-Rueckblick, Team-Impressionen.

GalleryBilderEindruck