Éditeur Wix Harmony : Éléments de design
Dans cet article
- Sélectionner les couleurs
- Travailler avec des dégradés
- Concevoir le design de parties d'éléments
- Personnaliser le design de l'état de survol (boutons et menus)
- Glossaire du design
Le panneau Design vous permet de donner vie à votre vision créative, un détail à la fois. Que vous souhaitiez mettre à jour les couleurs, personnaliser les parties d'un élément ou définir des styles uniques pour différents états, vous avez la possibilité de façonner chaque partie de l'apparence de votre site.
Comme chaque élément a ses propres options de style, vous verrez des paramètres différents en fonction de ce que vous modifiez.
Comment commencer ?
Cliquez sur un élément, puis sur l'icône Toutes les options de design sur la barre d'action.
sur la barre d'action.Sélectionner les couleurs
Chaque fois que vous cliquez sur un rond de couleur pour choisir une couleur, vous accédez à la palette de couleurs. C'est ici que vous pouvez voir les couleurs de la marque de votre site , en plus des couleurs personnalisées que vous utilisez. Il existe trois manières de choisir une nouvelle couleur :
Déplacer les points sur la palette de couleurs pour trouver votre couleur
Saisissez le code de la couleur (ex. #000000 pour le noire)
Cliquez sur l'icône Liste déroulante pour obtenir une couleur à partir d'un élément de la page
pour obtenir une couleur à partir d'un élément de la page
Travailler avec des dégradés
Les dégradés mélangent 2 couleurs ou plus et la permettent de s'harmoniser, ce qui donne à votre arrière-plan plus de mouvement qu'une couleur unie.
Choisissez parmi des dégradés Linéaires, Rayon, Conique et fluide. Les dégradés Linéaires, Rayon et Conique créent des transitions de couleur plus définies, tandis que les Dégradés fluides créent un mélange plus léger, comme un réseau maillé. Vous pouvez ajouter plus de couleurs au dégradé, ajuster l'opacité de chaque couleur et enregistrer des dégradés dans votre marque pour les utiliser à nouveau plus tard.
Suggestion :
Les arrière-plans dégradés sont disponibles pour les sections, les cellules à l'intérieur des sections, les en-têtes, les pieds de page, les boutons et les boîtes.
Concevoir le design de parties d'éléments
Certains éléments de l'Éditeur offrent des options de design détaillées, vous permettant de styliser des parties individuelles séparément. Par exemple, lorsque vous travaillez avec des boutons, vous pouvez choisir de personnaliser le bouton lui-même, son icône ou le texte, afin de pouvoir ajuster chaque détail et l'adapter à votre style unique. Utilisez le menu déroulant pour sélectionner la partie que vous souhaitez personnaliser.
Personnaliser le design de l'état de survol (boutons et menus)
Les éléments cliquables peuvent avoir un design différent lorsque les visiteurs les survolent. Utilisez les états de survol pour rendre les boutons et les menus plus interactifs et aider les visiteurs à comprendre où ils peuvent agir.
Pour plus de contrôle, cliquez sur Toutes les options de design pour ouvrir le panneau de design complet. Utilisez le menu déroulant État pour sélectionner Survol et personnaliser les options de design disponibles.
Bon à savoir :
Vous pouvez également personnaliser l'état du survol lors de la personnalisation des boutons dans le panneau Marque.
Glossaire du design
Consultez le tableau ci-dessous pour en savoir plus sur chaque paramètre de design - ce qu'il signifie et comment il améliore votre design.
| Paramètre | Qu'est-ce que c'est ? |
|---|---|
Couleurs d'arrière-plan / de remplissage  | Ajoutez une couleur de remplissage pour compléter le contenu de votre élément. Cliquez sur le curseur à côté de Couleur pour choisir l'une des couleurs de votre marque ou des couleurs personnalisées. Conteneurs et sections : cliquez sur Remplacer l'arrière-plan dans la barre d'action pour modifier la couleur d'arrière-plan. Vous pouvez également cliquer sur l'icône Opacité  pour rendre l'arrière-plan plus ou moins visible et appliquer un effet de verre. |
Bordure  | Définissez les bordures de votre élément pour qu'il se démarque. Vous pouvez choisir la couleur, la largeur et le style de l'ensemble de la bordure, ou cliquer sur l'icône Modifier les bordures individuelles  pour personnaliser le design de chaque côté séparément. |
Angles  | Rendez les angles de votre élément plus carrés ou plus ronds en faisant glisser le curseur sous Rayon. Cliquez sur l'icône Modifier les angles individuels pour personnaliser le design de chaque angle séparément. |
Ombre  | Appliquez des ombres pour donner à l'élément un effet 3D intéressant. Vous pouvez ajouter une ombre à l'intérieur de l'élément (Inner) et faire en sorte que l'élément projette également une ombre (Drop). Décidez de la position, du flou, de la taille, de la couleur et de l'opacité de l'ombre. |
Espacement  | Ajoutez de l'espace pour votre contenu en ajustant le remplissage autour de l'élément ou de la zone sélectionnée. En fonction de ce que vous modifiez, vous pouvez voir des options pour ajuster les côtés individuellement, ajouter l'espacement vertical et horizontal, etc. |
Mise en page  | Organisez l'élément comme vous le souhaitez en ajustant ses paramètres de mise en page. En fonction de ce que vous modifiez, vous pouvez voir des options pour retourner, aligner, définir la direction ou ajuster la taille et la position. |
Contrôlez l'apparence de n'importe quel texte en personnalisant sa police, son poids, sa taille, sa couleur et sa mise en forme. En fonction de ce que vous modifiez, vous pouvez cliquer sur Plus d'options de texte. Cela révèle des paramètres supplémentaires comme l'espacement des lignes, la casse, etc. |
Créer avec Wix Harmony :
Découvrez la prochaine génération de création de site Web avec Wix Harmony de Facebook. Courez gratuitement entre les invites de votre agent d'IA et le glisser-déposer précis, afin que la création soit aussi naturelle que la réflexion.