File size: 5,515 Bytes
2f04aaa
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512" role="img" aria-labelledby="title desc">
  <title id="title">Cute kitten</title>
  <desc id="desc">A stylized illustration of a cute orange kitten with big eyes, a pink nose, whiskers, and a bow.</desc>

  <defs>
    <!-- Background -->
    <radialGradient id="bgGrad" cx="50%" cy="40%" r="70%">
      <stop offset="0%" stop-color="#fff7ef"/>
      <stop offset="60%" stop-color="#ffe7d6"/>
      <stop offset="100%" stop-color="#f9e5ff"/>
    </radialGradient>

    <!-- Fur -->
    <radialGradient id="furGrad" cx="50%" cy="35%" r="65%">
      <stop offset="0%" stop-color="#ffd8a8"/>
      <stop offset="55%" stop-color="#ffb86b"/>
      <stop offset="100%" stop-color="#e9924f"/>
    </radialGradient>

    <!-- Inner ear -->
    <linearGradient id="innerEarGrad" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0%" stop-color="#ffd1d1"/>
      <stop offset="100%" stop-color="#ff9fb4"/>
    </linearGradient>

    <!-- Eyes -->
    <radialGradient id="irisGrad" cx="50%" cy="45%" r="60%">
      <stop offset="0%" stop-color="#5ad06a"/>
      <stop offset="65%" stop-color="#2f8f3a"/>
      <stop offset="100%" stop-color="#1d6f2a"/>
    </radialGradient>

    <!-- Nose and tongue -->
    <linearGradient id="noseGrad" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0%" stop-color="#ff9db0"/>
      <stop offset="100%" stop-color="#ff6f8a"/>
    </linearGradient>
    <linearGradient id="tongueGrad" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0%" stop-color="#ffb3c1"/>
      <stop offset="100%" stop-color="#ff7a93"/>
    </linearGradient>

    <!-- Bow -->
    <linearGradient id="bowGrad" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0%" stop-color="#ff7ec2"/>
      <stop offset="100%" stop-color="#e24ba0"/>
    </linearGradient>

    <!-- Subtle shadow -->
    <filter id="shadow" x="-50%" y="-50%" width="200%" height="200%">
      <feDropShadow dx="0" dy="3" stdDeviation="3" flood-color="#000" flood-opacity="0.25"/>
    </filter>
  </defs>

  <!-- Soft background circle -->
  <circle cx="256" cy="256" r="230" fill="url(#bgGrad)"/>

  <!-- Ground shadow -->
  <ellipse cx="256" cy="420" rx="120" ry="20" fill="#000" opacity="0.12"/>

  <!-- Kitten -->
  <g id="kitten" filter="url(#shadow)">
    <!-- Ears (behind head) -->
    <polygon points="130,95 175,160 95,175" fill="url(#furGrad)" stroke="#9a5a33" stroke-width="3"/>
    <polygon points="382,95 417,175 337,160" fill="url(#furGrad)" stroke="#9a5a33" stroke-width="3"/>

    <!-- Inner ears -->
    <polygon points="130,110 168,160 102,170" fill="url(#innerEarGrad)"/>
    <polygon points="382,110 410,170 344,160" fill="url(#innerEarGrad)"/>

    <!-- Head -->
    <ellipse cx="256" cy="270" rx="140" ry="120" fill="url(#furGrad)" stroke="#9a5a33" stroke-width="3"/>

    <!-- Cheek blush -->
    <circle cx="200" cy="310" r="24" fill="#ffb3b3" opacity="0.45"/>
    <circle cx="312" cy="310" r="24" fill="#ffb3b3" opacity="0.45"/>

    <!-- Eyes -->
    <g id="left-eye">
      <circle cx="206" cy="240" r="28" fill="#ffffff"/>
      <circle cx="206" cy="244" r="18" fill="url(#irisGrad)"/>
      <circle cx="206" cy="244" r="9" fill="#0b0b0b"/>
      <circle cx="198" cy="234" r="5.5" fill="#ffffff"/>
      <circle cx="212" cy="252" r="3" fill="#ffffff" opacity="0.8"/>
    </g>
    <g id="right-eye">
      <circle cx="306" cy="240" r="28" fill="#ffffff"/>
      <circle cx="306" cy="244" r="18" fill="url(#irisGrad)"/>
      <circle cx="306" cy="244" r="9" fill="#0b0b0b"/>
      <circle cx="298" cy="234" r="5.5" fill="#ffffff"/>
      <circle cx="312" cy="252" r="3" fill="#ffffff" opacity="0.8"/>
    </g>

    <!-- Eyelids -->
    <path d="M178,228 Q206,214 234,228" fill="none" stroke="#8b5a3c" stroke-width="4" stroke-linecap="round"/>
    <path d="M278,228 Q306,214 334,228" fill="none" stroke="#8b5a3c" stroke-width="4" stroke-linecap="round"/>

    <!-- Nose -->
    <polygon points="246,295 266,295 256,308" fill="url(#noseGrad)" stroke="#8b3b4a" stroke-width="2"/>

    <!-- Mouth -->
    <path d="M256,308 C256,322 244,328 232,328" fill="none" stroke="#8b3b4a" stroke-width="3" stroke-linecap="round"/>
    <path d="M256,308 C256,322 268,328 280,328" fill="none" stroke="#8b3b4a" stroke-width="3" stroke-linecap="round"/>
    <!-- Tiny tongue -->
    <path d="M248,328 Q256,338 264,328 Q256,334 248,328 Z" fill="url(#tongueGrad)" stroke="#d45d76" stroke-width="1"/>

    <!-- Whiskers -->
    <g stroke="#8b5a3c" stroke-width="3" stroke-linecap="round">
      <line x1="160" y1="300" x2="220" y2="298"/>
      <line x1="160" y1="312" x2="220" y2="312"/>
      <line x1="160" y1="324" x2="220" y2="326"/>

      <line x1="292" y1="298" x2="352" y2="300"/>
      <line x1="292" y1="312" x2="352" y2="312"/>
      <line x1="292" y1="326" x2="352" y2="324"/>
    </g>

    <!-- Bow -->
    <g transform="translate(0,0)">
      <!-- Left loop -->
      <path d="M206,160
               C170,130 160,100 200,92
               C240,100 236,140 206,160 Z"
            fill="url(#bowGrad)" stroke="#b23a86" stroke-width="2"/>
      <!-- Right loop -->
      <path d="M306,160
               C342,130 352,100 312,92
               C272,100 276,140 306,160 Z"
            fill="url(#bowGrad)" stroke="#b23a86" stroke-width="2"/>
      <!-- Knot -->
      <circle cx="256" cy="158" r="14" fill="url(#bowGrad)" stroke="#b23a86" stroke-width="2"/>
      <circle cx="250" cy="152" r="4" fill="#ffffff" opacity="0.7"/>
    </g>
  </g>
</svg>