Forme
Rectangle incliné
Sortie
clip-path: polygon(...)
Outils de design
Chemin de clip CSS — Générateur de formes
Générez des formes de chemin de clip CSS à partir de préréglages et de contrôles simples avec un aperçu en direct – utile pour les cartes inclinées, les badges, les recadrages d'images et les mises en page décoratives.
CSSchemin de clipForme
Ajouter cet outil aux favoris
Aucun mode de stockage des favoris n’a été sélectionné.
Actions rapides
Copiez l’URL de cet outil ou ouvrez la feuille de partage du système sur un appareil compatible.
设计配色
Chemin de clip CSS
Générez des formes de chemin de clip CSS à partir de préréglages et de contrôles simples avec un aperçu en direct – utile pour les cartes inclinées, les badges, les recadrages d'images et les mises en page décoratives.
最终 CSS 属性
Cas d’usage
- Créer des cartes angulaires ou irrégulières
- Recadrer une zone d'affichage d'image
- Créer des formes géométriques décoratives
Mode d’emploi
- Choisir une forme prédéfinie
- Ajuster les paramètres clés
- Prévisualisez et copiez le CSS
Exemples d’entrée et de sortie
FAQ
Prend-il en charge les polygones ?
Oui. Il génère des valeurs de chemin de clip prêtes pour CSS ; de nombreux préréglages deviennent des formes polygonales (...).
Comment est la prise en charge des anciens navigateurs ?
clip-path fonctionne bien dans les navigateurs modernes. Fournissez une solution de secours non tronquée si vous devez prendre en charge des environnements très anciens.
Outils
Outils associés
Poursuivez avec un autre outil traduit pour une tâche proche.
Générateur de triangle CSS
Générateur de triangle CSS avec aperçu en direct
Choisissez une direction, une taille et une couleur pour générer un triangle de bordure CSS pur avec un aperçu en direct et un code copiable.
CSS Triangle Forme
SVG Visualiseur de chemin
Visualiseur de chemin SVG — Commandes de débogage
Collez une longue chaîne de chemin d="M10 20 L... Z" ou une balise de chemin complet pour le visualiser sur une grille et inspecter la longueur et le nombre de commandes lors du débogage des icônes.
Conception SVG Chemin