Format SVG dans Google Web Designer

SVG est un format d'image basé sur le langage XML qui est utilisé pour les images vectorielles. Les images SVG peuvent être particulièrement utiles dans les mises en page responsives, car elles peuvent être redimensionnées sans perte de qualité.

Redimensionner les éléments SVG

Si vous redimensionnez une image ou une forme SVG pour l'agrandir, utilisez les propriétés de largeur et de hauteur plutôt que la mise à l'échelle 3D. Si vous utilisez la commande de transformation de l'outil de sélection, vous devrez peut-être modifier le style de dimensionnement.

Ajouter des images SVG

Il existe plusieurs façons d'ajouter des images SVG à un document :

• Importer un fichier SVG (voir ci-dessous pour en savoir plus)
• Utiliser les outils Stylo et Forme pour dessiner une forme SVG
• Insérer le code SVG directement dans la vue Code
• Coller le code SVG dans la vue Conception
• Convertir un élément textuel au format SVG en appliquant un filtre SVG

Importer des fichiers SVG

Vous pouvez importer un fichier SVG à l'aide de la commande de menu Fichier > Importer les éléments ou en le faisant glisser dans la fenêtre Google Web Designer.

Lorsque vous importez un fichier SVG, vous avez la possibilité soit de traiter le fichier SVG en tant qu'image, soit d'intégrer le code SVG dans le code HTML du document. Le tableau ci-dessous répertorie certains des cas d'utilisation de chaque méthode.

Image	Intégration
Peut être utilisé en tant que masque d'image Compatible avec les points de fuite Les couleurs peuvent être extraites Répertorié dans la bibliothèque	Compatible avec les filtres SVG Modifiable dans la vue Code

Filtres SVG

Vous pouvez ajouter des effets spéciaux aux éléments SVG à l'aide de filtres SVG, comme l'effet de flou, la brillance, etc. Consultez la liste complète des filtres SVG.

    

Exemples d'effets des filtres SVG (fichier SVG d'origine sur la gauche)