← Tous les outils texte

Générateur de clip-path CSS

Faites glisser des points pour créer polygones, cercles et formes, puis copiez le CSS clip-path.

  • Gratuit
  • Sans inscription
  • Fonctionne sur tous les appareils

À propos de Générateur de clip-path CSS

Découpez des éléments en triangles, hexagones, flèches, cercles ou tout polygone personnalisé en faisant glisser des points sur un aperçu, puis copiez la valeur clip-path. Les coordonnées en pourcentage gardent la forme adaptative. N'oubliez pas que les zones découpées existent toujours : les ombres et les bordures sont donc coupées aussi.

Comment utiliser Générateur de clip-path CSS

  1. Choisissez une forme comme un polygone ou un cercle.
  2. Faites glisser les points sur l'aperçu pour remodeler la forme.
  3. Copiez le CSS clip-path et appliquez-le à votre élément.

Pourquoi utiliser cet outil ?

Aussi appelé

Questions fréquentes

Pourquoi mon box-shadow est-il coupé avec clip-path ?

Clip-path coupe tout ce qui est en dehors de la forme, y compris les ombres. Placez l'ombre sur un conteneur parent, avec filter: drop-shadow, pour qu'elle suive le contour découpé.

Puis-je animer entre deux formes clip-path ?

Oui, si les deux formes utilisent la même fonction avec le même nombre de points. Le navigateur déplace alors chaque point en douceur pendant une transition.

clip-path change-t-il l'espace occupé par l'élément ?

Non. L'élément garde sa boîte d'origine dans la mise en page et seule la zone visible est découpée. Les clics en dehors de la forme visible sont aussi ignorés.

Générateur de clip-path CSS est-il gratuit ?

Oui. Générateur de clip-path CSS est gratuit sur Toolipedia, sans inscription et sans filigrane.

Est-ce sûr ?

Oui. Tous les calculs se font dans votre navigateur et rien de ce que vous saisissez n’est envoyé à notre serveur.

Est-ce que ça fonctionne sur mon téléphone ?

Oui. L’outil fonctionne dans tout navigateur récent sur Android et iPhone, ainsi que sur tablette et ordinateur. Il n’y a rien à installer.

Faut-il un compte ?

Non. Ouvrez simplement la page et utilisez l’outil. Aucune inscription ni adresse e-mail n’est nécessaire.

Puis-je mettre Générateur de clip-path CSS sur mon propre site ?

Oui. Utilisez le bouton « Intégrer sur votre site » sous l'outil pour copier un court extrait de code et le coller dans votre page. C'est gratuit, sans compte, et l'outil continue de fonctionner dans votre page.

Outils similaires