`public/logo.svg`

47 lines
<svg width="200" height="200" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
  <!-- Background circle -->
  <circle cx="100" cy="100" r="95" fill="url(#gradient1)" stroke="#764ba2" stroke-width="3"/>

  <!-- Gradient definition -->
  <defs>
    <linearGradient id="gradient1" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#f093fb;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#f5576c;stop-opacity:1" />
    </linearGradient>
    <linearGradient id="hairGradient" x1="0%" y1="0%" x2="0%" y2="100%">
      <stop offset="0%" style="stop-color:#8B4513;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#5C3317;stop-opacity:1" />
    </linearGradient>
  </defs>

  <!-- Stylized face -->
  <circle cx="100" cy="95" r="35" fill="#FFE4C4" stroke="#D4A574" stroke-width="2"/>

  <!-- Hair strands - flowing design -->
  <path d="M 65 70 Q 60 50, 55 35 Q 52 20, 50 10" stroke="url(#hairGradient)" stroke-width="8" fill="none" stroke-linecap="round"/>
  <path d="M 75 65 Q 72 45, 70 28 Q 68 15, 67 5" stroke="url(#hairGradient)" stroke-width="8" fill="none" stroke-linecap="round"/>
  <path d="M 85 62 Q 85 42, 85 25 Q 85 12, 85 3" stroke="url(#hairGradient)" stroke-width="9" fill="none" stroke-linecap="round"/>
  <path d="M 100 60 Q 100 40, 100 23 Q 100 10, 100 2" stroke="url(#hairGradient)" stroke-width="10" fill="none" stroke-linecap="round"/>
  <path d="M 115 62 Q 115 42, 115 25 Q 115 12, 115 3" stroke="url(#hairGradient)" stroke-width="9" fill="none" stroke-linecap="round"/>
  <path d="M 125 65 Q 128 45, 130 28 Q 132 15, 133 5" stroke="url(#hairGradient)" stroke-width="8" fill="none" stroke-linecap="round"/>
  <path d="M 135 70 Q 140 50, 145 35 Q 148 20, 150 10" stroke="url(#hairGradient)" stroke-width="8" fill="none" stroke-linecap="round"/>

  <!-- Eyes -->
  <circle cx="90" cy="90" r="4" fill="#333"/>
  <circle cx="110" cy="90" r="4" fill="#333"/>

  <!-- Smile -->
  <path d="M 85 105 Q 100 112, 115 105" stroke="#D4A574" stroke-width="2" fill="none" stroke-linecap="round"/>

  <!-- Scissors icon (stylist tool) -->
  <g transform="translate(145, 145)">
    <circle cx="0" cy="0" r="8" fill="none" stroke="#764ba2" stroke-width="2"/>
    <circle cx="0" cy="20" r="8" fill="none" stroke="#764ba2" stroke-width="2"/>
    <line x1="0" y1="8" x2="-15" y2="30" stroke="#764ba2" stroke-width="3"/>
    <line x1="0" y1="12" x2="-15" y2="30" stroke="#764ba2" stroke-width="3"/>
  </g>

  <!-- Text -->
  <text x="100" y="175" font-family="Arial, sans-serif" font-size="28" font-weight="bold" text-anchor="middle" fill="#fff">Melanie</text>
</svg>