HTML + CSSCheckboxen
8-Bit-Checkbox
Eine Pixel-Art-Box mit dicker Kontur, in der der Haken Quadrat für Quadrat erscheint.
Einstellungen
16px
1x
Code
<label class="uv-c8b"><input type="checkbox"><span class="bx"><b style="--x:1;--y:4;--i:0"></b><b style="--x:1;--y:5;--i:0"></b><b style="--x:2;--y:5;--i:1"></b><b style="--x:2;--y:6;--i:1"></b><b style="--x:3;--y:6;--i:2"></b><b style="--x:3;--y:7;--i:2"></b><b style="--x:4;--y:5;--i:3"></b><b style="--x:4;--y:6;--i:3"></b><b style="--x:5;--y:4;--i:4"></b><b style="--x:5;--y:5;--i:4"></b><b style="--x:6;--y:3;--i:5"></b><b style="--x:6;--y:4;--i:5"></b><b style="--x:7;--y:2;--i:6"></b><b style="--x:7;--y:3;--i:6"></b></span>Spiel speichern</label>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.
Mehr aus Checkboxen
Alle ansehen: CheckboxenWofür du ihn nutzen kannst
Nur mit CSS-Boxen und Schatten gebaut, erinnert diese Checkbox an die Menüs von Handheld-Konsolen: eine dicke, gestufte Kontur, eine Fase in der Box und ein Haken aus vierzehn Pixeln, die schnell nacheinander angehen. Das Label nutzt eine Monospace-Systemschrift und rundet den Arcade-Look ab.
Passt zu Spieleinstellungen, Retro-Portfolios, Coding-Bootcamps und verspielten To-do-Listen. Die Pixelgröße folgt dem Größenregler, sie bleibt also klein wie groß scharf, und die beiden Farben bestimmen Füllung und Lichtpixel.