AIMRAN
HTML + CSSHintergründe

Lochkarten im Leser

Reihen von Lochkarten aus den Sechzigern laufen durch einen Kartenleser, während kaltes Licht durch ihre Löcher scheint.

Einstellungen

1x
1x
1

Code

<div class="pt-uvq16-punch-cards"><i class="lt"></i><div class="rws"><div class="rw" style="--t:34s"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></div><div class="rw" style="--t:48s"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></div><div class="rw" style="--t:62s"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></div><div class="rw" style="--t:41s"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></div><div class="rw" style="--t:55s"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></div><div class="rw" style="--t:34s"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></div><div class="rw" style="--t:48s"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></div></div></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 Hintergründe

Alle ansehen: Hintergründe

Mesh-Gradient

HintergründeHTML + CSS

Polarlicht-Hintergrund

HintergründeHTML + CSS

Atmender Farbverlauf

HintergründeHTML + CSS

Flüssiger Sonnenuntergang

HintergründeHTML + CSS

Punktraster mit Welle

HintergründeHTML + CSS

Synthwave-Raster

HintergründeHTML + CSS

Waben-Hintergrund

HintergründeHTML + CSS

Diagonale Lichtlinien

HintergründeHTML + CSS

Wofür du ihn nutzen kannst

Bevor es Bildschirme gab, steckten Programme in Karton. Dieser Hintergrund stapelt schräge Reihen manilafarbener Lochkarten mit farbigem Kopfstreifen und gedruckten Zeilenlinien, jede durch eine CSS-Maske mit vierzig Spalten rechteckiger Löcher geschnitten. Die Reihen gleiten in entgegengesetzte Richtungen, dahinter wandert ein Lichtband, das durch jedes Loch leuchtet. Reines HTML und CSS.

Die erste Farbe ist der Karton, die zweite der Kopfstreifen, die dritte das Licht des Lesers. Die Dichte macht die Karten kleiner und bringt mehr Reihen ins Bild. Stark für Computergeschichte, Datenplattformen, Archive und Retro-Entwicklerevents.