J'ai fouillé le site Web OpenAI en F12 et sur leur première page et je suis très intéressé par le contexte principal.

La source de l'image renvoie vers une image 3x2 de pixels qui apparaît sur la première page du site Web, sous une forme dégradée floue.

J'ai vérifié tous les CSS associés avec les outils de développement Chrome, et je ne trouve rien sur la façon dont ils ont fait cela. J'ai également effectué des recherches sur Internet, qui ne permettent que de générer des dégradés avec CSS.

Comment pouvez-vous prendre une image basse résolution comme celle-ci et en faire un dégradé?

picture of website

1
Youseflapod 4 nov. 2019 à 22:37

1 réponse

Meilleure réponse

Le style de l'arrière-plan est le suivant:

background-image: url(/assets/images/home-gradient.gif?v=b0ac160331);
background-size: 100% 100%;

c'est à dire. ils étirent simplement cette petite image pour couvrir toute la zone.

1
radulfr 4 nov. 2019 à 21:32