Codepen: 20 Codeschnipsel für überzeugende Preisübersichten

Eine Preisübersicht ist stets das gestalterische Mittel der Wahl, wenn du ein Produkt mit unterschiedlichen Features zu unterschiedlichen Preisen darstellen willst. Preisübersichten sparen sowohl dir, wie auch deinen potenziellen Kunden Zeit, denn sie erlauben eine kompakte Darstellung der wichtigsten Aspekte auf engem Raum.

Wie immer im Design, kannst du hier ebensoviel falsch, wie richtig machen. Deshalb haben wir heute eine Sammlung guter Beispiele aus Codepen für dich zusammengestellt. Die meisten reagieren responsiv auf die Größe des Browserfensters, andere sind statischer, aber dennoch sehenswert, weil sie subtile Dynamik in der Nutzung entfalten. Viel Spaß beim Stöbern!

Titel: Ip Pricing Table

Erstellt von: Marcel

Titel: Adaptive Pricing Table

Erstellt von: Alex

Titel: Flat Pricing Table Design

Erstellt von: Mehmet Mert

Titel: Flat Pricing Table

Erstellt von: Andy Tran

Titel: Pricing Tables

Erstellt von: Joseph Victory

Titel: Pricing Table

Erstellt von: Mike Torosian

Titel: Price

Erstellt von: catcod

Titel: Pricing Table

Erstellt von: LittleSnippets.net

Titel: Pricing Tables

Erstellt von: Gerta Xhepi

Titel: Material Pricing Tables

Erstellt von: Kreso Galic

Titel: Flat pricing table

Erstellt von: Felix Franzén

Titel: Price Table Hover Effect

Erstellt von: Vladimir Lukyanov

Titel: CSS3 Pricing Table

Erstellt von: The Legend

Titel: Pricing Tables

Erstellt von: Eric Thayer

Titel: Pricing Table

Erstellt von: Dany Santos

Titel: Bootstrap Pricing Table

Erstellt von: Sahar Ali Raza

Titel: Flipping Pricing Table

Erstellt von: Felix Schwarzer

Titel: Responsive Flat Pricing Table

Erstellt von: Shane Heyns

Titel: Dark Themed Pricing Table

Erstellt von: LittleSnippets.net

Titel: Pricing Table Tickets/Passes Flip

Erstellt von: Hans Engebretsen