Vague profonde
Gratuit, sans inscription, fonctionne dans votre navigateur.
Trois points et presque toute l'amplitude, ce qui donne un creux profond et beaucoup de couleur en dessous. À utiliser là où le séparateur doit être la transition elle-même, et non un détail au bord de celle-ci.
Les réglages qui la produisent
| Générateur | Vague |
|---|---|
| Points | 3 |
| Amplitude | 92% |
| Irrégularité | 18% |
| Ligne de base | 50% |
| Couches | 1 |
| Douceur | 110% |
| Graine | 820 |
Ce qu'il faut savoir
- Trois points produisent un unique creux net plutôt qu'un motif répété.
- Une forte amplitude mange de la place verticale : laissez respirer la section du dessous.
- Reproductible à partir de la graine 820 — notez-la s'il vous faut la même courbe sur une autre page.
Ce que ça coûte en octets
Cette forme exacte pèse 282 octets en SVG et 443 octets en arrière-plan CSS — l'URI de données est plus lourde parce que l'encodage en pourcentage coûte trois caractères pour chacun qu'il échappe. Les deux chiffres concernent la forme montrée ci-dessus, avec deux décimales de précision sur les coordonnées.
| Format | Taille |
|---|---|
| SVG | 282 B |
| Arrière-plan CSS | 443 B |
| clip-path CSS | 474 B |
Le début du SVG de Vague profonde
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" preserveAspectRatio="none"><path d="M-480 80.61C-392 97.56,-176 145.02,0 173.07C176 201.12,304 252.99,480 233.6C656 214.21,784 82.6,960 67.28C1136 51.96,1352 134.87,1440 150.04L1440 320L-480 320Z" fill="#4f46e5"/></svg>Plus en détail
Une vague profonde est la forme la plus facile à rater, parce qu'à pleine amplitude la courbe doit s'arquer beaucoup et qu'un méplat là où elle rejoint le bord se voit immédiatement. Le générateur échantillonne un point au-delà de chaque bord du canevas et laisse le viewBox le rogner : le mouvement continue donc hors écran au lieu de s'arrêter à la limite — c'est ce qui fait lire ceci comme un fragment d'une vague plus longue plutôt que comme un gribouillis refermé sur lui-même.
Questions
Comment modifier Vague profonde une fois que je l'ai ?
Ouvrez le générateur, cliquez sur Vague profonde dans la rangée de préréglages, puis faites glisser ce que vous voulez. Le préréglage est un point de départ, pas un verrou — tous les curseurs restent actifs, et le champ de graine accepte un mot si vous préférez nommer votre forme plutôt que la numéroter.
Sera-t-elle identique la prochaine fois ?
Oui, tant que la graine est la même. Celle-ci est la graine 820 avec 3 points. Le générateur est déterministe : ces réglages reproduisent cette courbe exacte sur n'importe quel appareil.
Puis-je utiliser une autre couleur ?
Oui — la couleur est appliquée à l'export, elle n'est pas figée dans la géométrie. L'aperçu ci-dessus utilise la couleur par défaut ; choisissez la vôtre dans le générateur et le SVG, l'arrière-plan CSS et le clip-path suivront.
Chaque chiffre et chaque forme de cette page ont été produits en exécutant le générateur au moment de la compilation : ils décrivent donc l'outil que vous vous apprêtez à utiliser, et non une version qui a existé un jour.