HTML + CSSKarten

Spielmodul für Retro-Konsole

Ein graues Spielmodul mit Pixel-Etikett: Ein Klick schiebt es in die Konsole, und der grüne Bildschirm startet mit Logo.

Einstellungen

16px
1x

Code

<div class="uvq07-crt"><div class="st" aria-hidden="true"><div class="ct"><i class="gr"></i><span class="lb"><span class="art"><svg viewBox="0 0 16 10" shape-rendering="crispEdges" aria-hidden="true"><rect width="16" height="10" fill="#8fd3ff"/><rect x="12" y="1" width="2" height="2" fill="#ffe066"/><rect x="2" y="4" width="4" height="2" fill="#3b4b7a"/><rect x="3" y="3" width="2" height="1" fill="#3b4b7a"/><rect x="9" y="3" width="5" height="3" fill="#2f3d66"/><rect x="10" y="2" width="3" height="1" fill="#2f3d66"/><rect x="11" y="1" width="1" height="1" fill="#fff"/><rect y="6" width="16" height="4" fill="#4caf50"/><rect y="8" width="16" height="2" fill="#3a8a3e"/><rect x="6" y="5" width="1" height="1" fill="#ffcc99"/><rect x="6" y="6" width="1" height="2" fill="#e53935"/></svg></span><b>Abenteuer in Pixelia</b></span></div><div class="cn"><i class="sl"></i><span class="scr"><b>PIXELIA</b><span class="ps">START drücken</span></span><i class="pw"></i><i class="dp"></i><i class="ab"></i></div></div><button type="button" aria-pressed="false" data-a="Modul einstecken" data-b="Modul auswerfen">Modul einstecken</button></div>

Prompt für KI

Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.

Markdown-Version mit dem ganzen Code, für KI-Assistenten

Mehr aus Karten

Alle ansehen: Karten

Wofür du ihn nutzen kannst

Eine nostalgische Karte für Spiele und kreative Launches. Das Modul hat Griffrillen, eine abgeschrägte Ecke und ein Pixel-Art-Etikett als scharfes SVG; beim Einstecken gleitet es hinter das Konsolengehäuse, der grüne Bildschirm geht an, das Logo fällt stufenweise herein und ein Startsignal blinkt. Gut für Spieleseiten, Hackathons, Retro-Shops und versteckte Gags im Portfolio.

Die Hauptfarbe ist das Etikett und die Konsolentasten, die zweite der Bildschirm. Ändere den Spieltitel, zeichne die Szene aus 16 mal 10 Pixeln neu und drücke erneut zum Auswerfen.