Files
doc-svg/exercices/svg-3.html
2025-10-30 13:08:21 +01:00

49 lines
2.1 KiB
HTML
Executable File

<html>
<head>
<title>SVG Bibliothèque</title>
<style>
.themeA {
--couleur1: #9CC6B9;
--couleur2: #B6CDE1;
--couleur3: #6486AA;
--couleur4: #D6F0E7;
--couleur5: #7ECCD0;
--couleur6: #9CC6B9;
}
.themeB {
--couleur1: #C9959B;
--couleur2: #D6D1CF;
--couleur3: #829E45;
--couleur4: #825E4C;
--couleur5: #CCA98A;
--couleur6: #9CC6B9;
}
</style>
</head>
<body>
<svg>
<use href="#cnbc" x="200" y="30" transform="scale(0.6)" class="themeA"></use>
<use href="#cnbc" x="10" y="30" transform="scale(0.6)" class="themeB"></use>
</svg>
<svg width="0" height="0">
<defs>
<symbol id="cnbc" viewBox="-66.809 -112.76 700.806 560.091">
<path style="fill:var(--couleur1)" d="M25.497,9.818c-28.003,25.35-38.195,82.79,12.286,116.368l201.391,138.169L141.526,40.642C121.064-12.149,65.086-23.661,25.497,9.818" />
<path style="fill:var(--couleur2)" d="M198.857-98.951c-32.736,0.667-81.893,39.65-60.017,99.178l100.995,238.186l35.489-250.526C283.536-74.363,236.427-103.099,198.857-98.951" />
<path style="fill:var(--couleur3)" d="M291.084-21.668h19.097c0,0,10.198,0,11.586,4.811c-7.515,6.137-27.97,6.906-25.254,39.687l32.103,215.549L428.921-0.432c20.517-53.322-22.548-97.854-60.749-99.215c-1.784-0.128-3.575-0.232-5.429-0.232C328.456-99.88,289.164-74.961,291.084-21.668" />
<path style="fill:var(--couleur4)" d="M424.883,42.671l-94.872,221.029l201.332-138.898 c46.41-32.918,38.925-85.546,12.946-111.56C533.398,0.998,513.401-8.46,492.218-8.46C467.192-8.465,440.409,4.809,424.883,42.671" />
<path style="fill:var(--couleur5)" d="M508.801,156.251L319.726,288.318h232.806c47.763,0,78.457-49.246,64.812-94.438c-9.139-28.406-36.177-50.704-67.56-50.736C536.574,143.149,522.565,147.128,508.801,156.251" />
<path style="fill:var(--couleur6)" d="M20.072,288.318h229.371L60.32,156.251C16.628,128.179-32.5,144.605-50.236,191.19C-65.27,244.517-27.733,288.318,20.072,288.318" />
</symbol>
</defs>
</svg>
</html>