HTML + CSSArrière-plans

Fond pluie Matrix

Des colonnes de caractères tombent avec une traînée lumineuse sur un canvas. Plein écran, en HTML, CSS et un peu de JS.

Réglages

1x
1x
1

Code

<div class="pt-matrix"><canvas></canvas></div>

Prompt pour l’IA

Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.

Plus dans Arrière-plans

Où l’utiliser

Le fond pluie Matrix fonctionne toujours quand un site veut donner l’impression de vivre dans un terminal : une société de cybersécurité, la page d’un hackathon ou d’un CTF, le portfolio d’un développeur, une 404 pleine d’humour. Katakana, chiffres et symboles tombent en colonnes avec une tête brillante et une traînée qui s’efface.

L’animation continue même si le visiteur a demandé moins de mouvement à son système : ajoutez vous-même cette vérification si elle couvre une grande surface. La densité change la taille des caractères. Avec du texte par-dessus, baissez l’opacité pour que la pluie reste en arrière-plan.