DeviceShowcase3D

Inhalt

Schwebendes 3D-Geräte-Mockup aus purem CSS (Laptop oder Smartphone), das sich zur Maus neigt und einen Screenshot zeigt — inklusive Float-Animation und gegenläufigem Bodenschatten. Ideal für Projekt-Referenzen.

Live Demo

Mit der Maus über die Geräte fahren — sie neigen sich in 3D

Props / API

Prop	Typ	Pflicht	Default	Beschreibung
`screenshot`	`string`	Ja	—	Screenshot-URL
`variant`	`'laptop' \| 'phone'`	Nein	`'laptop'`	Gerätetyp
`alt`	`string`	Nein	—	Alt-Text
`maxTilt`	`number`	Nein	`14`	Maximaler Neigungswinkel
`float`	`boolean`	Nein	`true`	Schwebe-Animation
`frameColor`	`string`	Nein	`'#1c2230'`	Gehäusefarbe
`className`	`string`	Nein	—	Zusätzliche CSS-Klasse

Code-Beispiel

<DeviceShowcase3D
  screenshot="/images/projekt-screenshot.jpg"
  variant="laptop"
  alt="Website der Pizzeria Bella Napoli"
/>