HTML + CSSArrière-plans

Dégradé à grain

Un grain de pellicule animé sur un dégradé sombre traversé par une lumière, pour une texture argentique.

Réglages

1x
1x
1

Code

<div class="pt-grain"><b></b><i></i></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 grain retire au dégradé son côté trop numérique et lui donne l’air d’une photo argentique. Il trouve sa place sur le portfolio d’une photographe, la page d’accueil d’un studio créatif ou la sortie d’un album. Le bruit scintille comme une vraie pellicule pendant que la lumière se déplace lentement. Un fond effet grain de film, en CSS.

Le grain est volontairement léger. Si vous montez l’opacité, vérifiez aussi sur mobile, où le bruit ressort davantage sur les petits écrans lumineux. Il s’accorde très bien avec de grands titres à empattements et beaucoup d’espace blanc.