Comment utiliser le générateur
- Choisissez Linéaire ou Radial.
- Pour un dégradé linéaire, faites glisser l'angle. 0° va du bas vers le haut, 90° de la gauche vers la droite, 180° du haut vers le bas.
- Changez les couleurs. Chacune a un curseur pour sa position, de 0 % au début à 100 % à la fin.
- Ajoutez des couleurs avec Ajouter une couleur, jusqu'à cinq. La nouvelle se place dans le plus grand écart.
- Copiez le CSS, ou choisissez une taille et appuyez sur Télécharger en PNG.
Inverser retourne l'ordre des couleurs. Couleurs au hasard essaie un nouveau jeu et garde la position de chaque couleur. Le dégradé se trouve aussi dans l'adresse de la page, le lien le ramène donc.
Les tailles
- Post carré, 1080 x 1080 : posts du fil Instagram, Facebook et LinkedIn.
- Post portrait, 1080 x 1350 : le post de fil le plus haut sur Instagram et Facebook. Il prend plus de place à l'écran.
- Story ou reel, 1080 x 1920 : Stories, Reels, TikTok et YouTube Shorts.
L'aperçu prend la forme de la taille choisie, vous voyez donc l'image que vous obtenez. Le PNG est dessiné avec le même angle et les mêmes arrêts que le CSS, il correspond donc à l'aperçu.
Des dégradés qui font de l'effet
- Gardez les couleurs proches. Deux voisines sur le cercle chromatique, comme le bleu et le turquoise, se fondent en douceur. Des opposées, comme le bleu et l'orange, peuvent virer au gris au milieu. Ajoutez une troisième couleur entre elles pour garder de l'éclat.
- Utilisez un clair et un sombre d'une même couleur pour un fond calme qui ne gêne jamais votre texte.
- Mettez le texte du côté calme. Un texte sur le milieu d'un dégradé marqué change de contraste d'une lettre à l'autre.
Utilisez-le dans l'éditeur de visuels de Postfjord
Dans l'éditeur de visuels, choisissez une forme ou la page et sélectionnez Dégradé sous ses couleurs. Réglez la première et la deuxième couleur, une couleur du milieu, la direction et l'angle. Dégradés de ce visuel sont créés à partir de vos propres couleurs, ils vont donc avec votre marque. Un visuel s'enregistre dans toutes les tailles dont vos canaux ont besoin.
FAQ
Quelle est la différence entre linéaire et radial ?
Un dégradé linéaire suit une ligne droite à l'angle que vous réglez. Un dégradé radial part du milieu et s'étend en cercle jusqu'aux coins.
Puis-je utiliser le PNG comme post ?
Oui. C'est une simple image sans filigrane. Ajoutez du texte dans votre app de design, ou publiez-la comme fond pour une citation.
Le CSS fonctionne-t-il dans tous les navigateurs ?
Oui. linear-gradient et radial-gradient fonctionnent dans tous les navigateurs utilisés aujourd'hui.
L'outil enregistre-t-il mon dégradé ?
Seulement dans le lien. Il tourne dans votre navigateur, et rien n'est envoyé à Postfjord ni enregistré.