---
layout: layouts/page.njk
title: Création de logo - Solution
---

Mettre la guitare dans un symbole

```svg
 <svg width="0" height="0">
    <defs>
      <symbol id="logo" viewBox="0 0 212 318">
        <path d="M 104.23504,110.47425 z" />
     <path ... />
```

AJouter llorsque cela est nécessaire le remplissage avec la couleur courante

```svg
<path
  style="fill:currentColor;stroke-width:3;"
  d="M 104.23504,110.47425 A 100,100 0 0 0 4.2349596,210.47435 100 z" />
<path
  style="stroke-width:3;"
  d="m 151.40116,122.29781 c 1.80158,-4.26514 4.26943,-10.0602 6.6983,-15.69516 8.35991,-19.39459 14.44103,-34.054253 16.z" />
```

Ajouter le symbole de la guitare dans le SVG à l'aide de la balise use

```svg
<use href="#logo" width="250" height="500"  />
<use href="#logo" width="250" height="500" x="250" />
<use href="#logo" width="250" height="500" x="500" />
```

Ajouter pour chaque symbole les couleurs de remplissage, de contour et courante.

```svg
<use href="#logo" width="250" height="500" fill="#384d6c" stroke="#fbebd1" color="#8fcdcc" />
<use href="#logo" width="250" height="500" x="250" fill="#780000" stroke="#c1121f" color="#fdf0d5"/>
<use href="#logo" width="250" height="500" x="500" fill="#ffc8dd" stroke="#ffafcc" color="#bde0fe"/>
```

## Le code complet

Mais tout doit être fait avec Inkscape

```svg
<svg width="0" height="0">
  <defs>
    <symbol id="logo" viewBox="0 0 212 318">
      <path
      style="fill:currentColor;stroke-width:3;"
      d="M 104.23504,110.47425 A 100,100 0 0 0 4.2349596,210.47435 100,100 0 0 0 104.23504,310.47444 100,100 0 0 0 204.23462,210.47435 100,100 0 0 0 104.23504,110.47425 Z m 0,25.00002 a 75,75 0 0 1 75.00008,75.00008 75,75 0 0 1 -75.00008,75.00007 75,75 0 0 1 -75.000057,-75.00007 75,75 0 0 1 75.000057,-75.00008 z" />
    <path
      style="stroke-width:3;"
      d="m 151.40116,122.29781 c 1.80158,-4.26514 4.26943,-10.0602 6.6983,-15.69516 8.35991,-19.39459 14.44103,-34.054253 16.32097,-39.346438 1.00941,-2.841577 3.36242,-6.303719 5.40225,-7.948869 1.46934,-1.18504 3.55483,-1.799871 5.90868,-1.742011 l 1.55598,0.03824 1.56167,-4.078822 c 1.90607,-4.977905 2.72427,-8.891188 3.46852,-16.592267 0.61436,-6.356969 1.45299,-10.324838 2.45049,-11.593607 0.37639,-0.478761 2.01998,-1.196248 4.11345,-1.795757 5.55883,-1.591844 8.16049,-4.111 8.76587,-8.487854 0.33524,-2.423684 -0.36752,-5.1816006 -1.94148,-7.6196906 -0.8726,-1.351809 -1.29116,-1.643838 -4.23334,-2.958992 -2.27806,-1.018291 -3.05842,-1.319083 -4.14186,-1.293979 -0.36115,0.0084 -0.75604,0.05314 -1.25109,0.119372 -4.3135,0.577101 -6.53623,2.455587 -15.68793,13.2606926 -6.32213,7.464308 -21.96075,26.722808 -24.65638,30.363519 -1.68431,2.274692 -1.7561,2.440599 -1.7048,3.943429 0.0453,1.327484 0.43065,2.020081 2.50579,4.505667 2.75223,3.296586 3.51998,4.805619 3.50418,6.885368 -0.0159,2.094815 -3.87912,11.155479 -11.13576,26.116753 -4.539,9.358215 -8.84197,18.342936 -13.0638,27.254666 l -10.69082,22.82186 c -1.34055,2.89142 -2.67861,5.76501 -4.02663,8.6956 -4.67911,10.17236 -9.37447,20.118 -10.43398,22.10149 l -1.92599,3.6065 -1.98437,0.68006 c -1.72964,0.59299 -2.19415,0.58601 -3.61683,-0.0517 -3.240527,-1.45304 -5.039973,-3.60982 -5.837363,-6.99647 -0.68649,-2.91559 -0.34811,-5.68341 1.5906,-13.00179 2.357373,-8.89882 2.476383,-10.52474 0.893476,-12.1977 -0.874616,-0.92439 -3.091926,-1.74361 -5.722646,-2.1146 -3.30275,-0.46578 -8.350326,2.60985 -11.794108,7.18664 -6.906903,9.17929 -9.130742,15.70744 -10.849467,31.8518 -1.13102,10.62397 -2.014895,14.64379 -4.389395,19.95589 -3.356311,7.50854 -6.235602,11.07514 -14.69626,18.20302 -9.707893,8.17864 -15.231494,14.02551 -18.290357,20.08043 10.853179,29.3935 38.835226,48.94244 70.16832,49.0213 7.65143,-0.01 15.2563,-1.19059 22.55056,-3.50108 0.23575,-0.46303 0.45374,-0.88014 0.73225,-1.45056 4.19435,-8.59031 4.85849,-13.24549 4.16874,-29.23129 -0.62807,-14.55622 -0.56318,-15.53387 1.27072,-19.14095 1.25932,-2.47694 1.92548,-3.27423 6.17947,-7.39593 6.34066,-6.14343 8.39371,-8.74629 10.89546,-13.81208 2.28989,-4.63679 3.30179,-8.08848 3.28249,-11.19828 -0.0149,-2.39269 -0.97313,-5.68306 -2.0469,-7.02955 -1.99271,-2.49881 -3.86496,-1.78745 -7.74062,2.94039 -5.64969,6.89195 -8.36282,8.11874 -14.81615,6.69985 -3.41218,-0.75023 -6.94061,-2.51898 -7.84913,-3.93516 -0.34323,-0.53503 -0.59764,-1.45864 -0.56534,-2.05207 0.0331,-0.60935 2.06332,-5.79197 4.66432,-11.9078 2.53303,-5.95606 6.28059,-14.77567 8.32765,-19.5988 1.92684,-4.53998 5.53729,-12.98879 8.28787,-19.40192 z"
        />
    <path
      style="fill:currentColor;stroke-width:0.37352"
      d="m 98.987826,179.06644 c 1.186294,-0.0227 2.564984,0.69733 3.994584,2.10943 l 1.63194,1.61231 -2.65668,5.94279 -2.656684,5.9433 8.866124,3.96307 8.86612,3.96306 0.77825,-1.74149 c 0.68047,-1.52231 0.8404,-1.67765 1.26866,-1.23558 0.26946,0.27816 1.77748,1.53803 3.35121,2.79983 4.89594,3.9255 8.83224,4.73199 14.27045,2.92385 3.8223,-1.27087 7.04324,-4.26652 11.57914,-10.76989 1.04125,-1.49291 1.93962,0.081 1.97042,3.4525 0.0163,1.80167 -0.21473,2.55391 -1.98644,6.46163 -2.45512,5.4149 -3.74323,7.06022 -11.24376,14.36088 -6.65368,6.47638 -7.50704,7.58909 -9.12192,11.89384 -1.65633,4.41523 -1.93629,7.0484 -1.87689,17.64285 0.0747,13.31827 -0.96066,23.13482 -2.9037,27.53217 -0.80113,1.813 -1.37762,2.28111 -3.18172,2.58537 -3.07443,0.51851 -5.00536,-1.95538 -8.98239,-11.5073 -1.72999,-4.15502 -3.78362,-7.07055 -6.52829,-9.26869 -2.4458,-1.95876 -16.190803,-8.78034 -24.249673,-12.03492 -9.865633,-3.98426 -10.149785,-4.18029 -11.822017,-8.15299 -1.830152,-4.3479 -1.246085,-8.71772 1.913059,-14.30972 1.871173,-3.31215 2.968635,-4.59234 9.636622,-11.24376 6.56063,-6.54432 8.949776,-9.48291 11.103716,-13.65705 1.73229,-3.35701 4.19387,-10.85418 4.80487,-14.63373 0.44513,-2.75334 0.93828,-3.7972 2.05828,-4.35942 0.34757,-0.17448 0.72129,-0.26477 1.116719,-0.27234 z"
        />
    <path
      style="stroke-width:0.37352"
      d="m 83.717445,228.85875 c -2.221939,-0.18303 -3.689598,3.52801 -1.939417,4.90409 0.436806,0.34345 3.531457,2.53238 6.877099,4.86431 3.34564,2.33194 6.5473,4.46823 7.11481,4.74699 1.04755,0.51465 2.59324,0.12265 3.568259,-0.90485 0.790864,-0.83346 0.733904,-2.76285 -0.1049,-3.54604 -0.425079,-0.3969 -3.851149,-2.8043 -7.613489,-5.34954 -5.08697,-3.44137 -7.11284,-4.64996 -7.902362,-4.71496 z"
      id="path60599" />
    <path
      style="stroke-width:0.37352"
      d="m 89.952207,213.52894 c -0.13053,0.0105 -0.25023,0.035 -0.3731,0.0677 -1.47645,0.39326 -2.32131,2.31023 -1.74718,3.96565 l 0.42478,1.2237 8.07857,3.61115 c 7.656603,3.4225 8.141973,3.59544 9.292973,3.30626 1.54938,-0.3893 2.61118,-2.46184 2.0345,-3.97082 -0.35656,-0.93285 -0.8319,-1.18975 -8.694044,-4.70411 -6.665599,-2.97952 -8.102769,-3.57316 -9.016499,-3.49952 z"
      id="path60597" />
    <path
      style="stroke-width:0.37352"
      d="m 98.355307,196.70619 -1.21077,0.46302 c -0.66613,0.25458 -1.35501,0.78424 -1.53066,1.17719 -0.40167,0.8986 -0.29733,2.99683 0.17312,3.48403 0.19551,0.20245 3.973416,2 8.395863,3.99458 7.64083,3.44614 8.10123,3.61171 9.25524,3.32177 1.5494,-0.3893 2.61119,-2.46184 2.03451,-3.97082 -0.35667,-0.93326 -0.83135,-1.19021 -8.74676,-4.7284 z"
        />
    <path
      id="path34102-5"
      style="display:none;fill:none"
      d="M 111.25815,18.14912 A 87.5,87.5 0 0 0 16.95635,98.271957 87.5,87.5 0 0 0 97.079177,192.57377 87.5,87.5 0 0 0 191.38099,112.45093 87.5,87.5 0 0 0 111.25815,18.14912 Z" />
    <path
      id="path34102-5-0"
      style="display:none;fill:none"
      d="M 82.586028,190.1579 A 87.5,87.5 0 0 1 19.372212,83.778797 87.5,87.5 0 0 1 125.75131,20.564983 87.5,87.5 0 0 1 188.96513,126.94408 87.5,87.5 0 0 1 82.586028,190.1579 Z" />
    <text
      style="font-style:normal;font-weight:normal;font-size:12.7px;line-height:1.25;letter-spacing:0px;word-spacing:0px;stroke:none;stroke-width:0.264583"
      id="text35037"
      transform="translate(0.06622166,105.11282)"><textPath
        xlink:href="#path34102-5-0"
        startOffset="50%"
        id="textPath48599"
        style="font-size:12.7px;"><tspan
          id="tspan35035"
          style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:12.7px;font-family:'Century Gothic';-inkscape-font-specification:'Century Gothic Bold';text-align:center;text-anchor:middle;stroke-width:0.264583"
          dy="3.5783134">♬ Boutique de          Guitare ♬</tspan></textPath></text>
    <text
      xml:space="preserve"
      style="font-style:normal;font-weight:normal;font-size:12.7px;line-height:1.25;letter-spacing:0px;word-spacing:0px;stroke:none;stroke-width:0.264583"
      id="text35037-0"
      transform="translate(0.06622166,105.11282)"><textPath
        xlink:href="#path34102-5"
        startOffset="50%"
        id="textPath48621"
        style="font-size:12.7px;"><tspan
          id="tspan35035-3"
          style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:12.7px;font-family:'Century Gothic';-inkscape-font-specification:'Century Gothic Bold';text-align:center;text-anchor:middle;stroke-width:0.264583"
          dy="4.3734941">★ Depuis 1973 ★</tspan></textPath></text>

    </symbol>
  </defs>
</svg>
<svg width="750" height="800">
  <use href="#logo" width="250" height="500" fill="#384d6c" stroke="#fbebd1" color="#8fcdcc" />
  <use href="#logo" width="250" height="500" x="250" fill="#780000" stroke="#c1121f" color="#fdf0d5"/>
  <use href="#logo" width="250" height="500" x="500" fill="#ffc8dd" stroke="#ffafcc" color="#bde0fe"/>
</svg>
```