File size: 6,659 Bytes
7b0a5fd
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
<svg width="600" height="600" viewBox="0 0 600 600" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="title desc">
  <title id="title">Cute Kitten</title>
  <desc id="desc">A cute cartoon kitten with soft fur, big eyes, whiskers, paws, and a tail.</desc>

  <defs>
    <!-- Fur gradient -->
    <radialGradient id="furGrad" cx="50%" cy="40%" r="70%">
      <stop offset="0%" stop-color="#f7c46b"/>
      <stop offset="60%" stop-color="#e7a45a"/>
      <stop offset="100%" stop-color="#c87d3f"/>
    </radialGradient>

    <!-- Belly patch gradient -->
    <radialGradient id="bellyGrad" cx="50%" cy="50%" r="70%">
      <stop offset="0%" stop-color="#fff5e8"/>
      <stop offset="100%" stop-color="#f1ded0"/>
    </radialGradient>

    <!-- Inner ear gradient -->
    <radialGradient id="innerEarGrad" cx="50%" cy="50%" r="70%">
      <stop offset="0%" stop-color="#ffd5e0"/>
      <stop offset="100%" stop-color="#f0b6c3"/>
    </radialGradient>

    <!-- Eye iris gradient -->
    <radialGradient id="irisGrad" cx="50%" cy="50%" r="50%">
      <stop offset="0%" stop-color="#66e0b5"/>
      <stop offset="70%" stop-color="#2aa67a"/>
      <stop offset="100%" stop-color="#1f7a5a"/>
    </radialGradient>

    <!-- Nose gradient -->
    <radialGradient id="noseGrad" cx="50%" cy="50%" r="60%">
      <stop offset="0%" stop-color="#ff8aa1"/>
      <stop offset="100%" stop-color="#e06b84"/>
    </radialGradient>

    <!-- Drop shadow for the kitten -->
    <filter id="kittenShadow" x="-50%" y="-50%" width="200%" height="200%">
      <feGaussianBlur in="SourceAlpha" stdDeviation="3" result="blur"/>
      <feOffset in="blur" dx="0" dy="3" result="offsetBlur"/>
      <feComponentTransfer>
        <feFuncA type="linear" slope="0.4"/>
      </feComponentTransfer>
      <feMerge>
        <feMergeNode/>
        <feMergeNode in="SourceGraphic"/>
      </feMerge>
    </filter>

    <!-- Soft glow for eyes -->
    <filter id="eyeGlow" x="-50%" y="-50%" width="200%" height="200%">
      <feGaussianBlur stdDeviation="1.2" result="blur"/>
      <feMerge>
        <feMergeNode in="blur"/>
        <feMergeNode in="SourceGraphic"/>
      </feMerge>
    </filter>

    <!-- Clip path for body stripes -->
    <clipPath id="bodyClip">
      <ellipse cx="300" cy="360" rx="150" ry="180"/>
    </clipPath>
  </defs>

  <!-- Background -->
  <rect width="100%" height="100%" fill="#f7f4ff"/>

  <g id="kitten" filter="url(#kittenShadow)">
    <!-- Tail (behind body) -->
    <path d="M 430 360
             C 520 380 520 480 450 520
             C 480 500 480 450 460 430
             C 440 415 435 390 430 360 Z"
          fill="url(#furGrad)" stroke="#8c5a30" stroke-opacity="0.25" stroke-width="2"/>

    <!-- Body -->
    <ellipse cx="300" cy="360" rx="150" ry="180" fill="url(#furGrad)" stroke="#8c5a30" stroke-opacity="0.25" stroke-width="2"/>

    <!-- Belly patch -->
    <ellipse cx="300" cy="410" rx="95" ry="120" fill="url(#bellyGrad)" opacity="0.95"/>

    <!-- Body stripes (clipped to body) -->
    <g clip-path="url(#bodyClip)" opacity="0.35">
      <path d="M 190 290 C 230 310 260 330 290 350" stroke="#8c5a30" stroke-width="14" stroke-linecap="round" fill="none"/>
      <path d="M 170 330 C 210 350 240 370 270 390" stroke="#8c5a30" stroke-width="14" stroke-linecap="round" fill="none"/>
      <path d="M 210 420 C 250 440 280 460 310 480" stroke="#8c5a30" stroke-width="14" stroke-linecap="round" fill="none"/>
      <path d="M 230 250 C 270 270 300 290 330 310" stroke="#8c5a30" stroke-width="14" stroke-linecap="round" fill="none"/>
    </g>

    <!-- Spots -->
    <ellipse cx="230" cy="320" rx="26" ry="18" fill="#d58a4f" opacity="0.6"/>
    <ellipse cx="360" cy="430" rx="22" ry="16" fill="#d58a4f" opacity="0.6"/>
    <ellipse cx="265" cy="470" rx="18" ry="12" fill="#d58a4f" opacity="0.6"/>

    <!-- Ears (behind head) -->
    <path d="M 220 115 L 190 50 L 255 100 Z" fill="url(#furGrad)" stroke="#8c5a30" stroke-opacity="0.25" stroke-width="2"/>
    <path d="M 380 115 L 410 50 L 345 100 Z" fill="url(#furGrad)" stroke="#8c5a30" stroke-opacity="0.25" stroke-width="2"/>

    <!-- Inner ears -->
    <path d="M 230 110 L 200 70 L 250 95 Z" fill="url(#innerEarGrad)" opacity="0.9"/>
    <path d="M 370 110 L 400 70 L 350 95 Z" fill="url(#innerEarGrad)" opacity="0.9"/>

    <!-- Head -->
    <circle cx="300" cy="220" r="110" fill="url(#furGrad)" stroke="#8c5a30" stroke-opacity="0.25" stroke-width="2"/>

    <!-- Cheeks -->
    <ellipse cx="265" cy="255" rx="22" ry="16" fill="#ffd8e2" opacity="0.85"/>
    <ellipse cx="335" cy="255" rx="22" ry="16" fill="#ffd8e2" opacity="0.85"/>

    <!-- Eyes -->
    <g filter="url(#eyeGlow)">
      <ellipse cx="265" cy="215" rx="26" ry="34" fill="url(#irisGrad)" stroke="#1a5e44" stroke-opacity="0.2" stroke-width="1.5"/>
      <ellipse cx="335" cy="215" rx="26" ry="34" fill="url(#irisGrad)" stroke="#1a5e44" stroke-opacity="0.2" stroke-width="1.5"/>

      <!-- Pupils -->
      <ellipse cx="265" cy="218" rx="6" ry="14" fill="#1b1b1b"/>
      <ellipse cx="335" cy="218" rx="6" ry="14" fill="#1b1b1b"/>

      <!-- Eye shine -->
      <circle cx="258" cy="205" r="4" fill="#ffffff" opacity="0.9"/>
      <circle cx="328" cy="205" r="4" fill="#ffffff" opacity="0.9"/>
    </g>

    <!-- Nose -->
    <path d="M 295 245 L 305 245 L 300 255 Z" fill="url(#noseGrad)"/>

    <!-- Mouth -->
    <path d="M 300 255 C 292 265 280 265 272 255" stroke="#7a3b3b" stroke-width="3" fill="none" stroke-linecap="round"/>
    <path d="M 300 255 C 308 265 320 265 328 255" stroke="#7a3b3b" stroke-width="3" fill="none" stroke-linecap="round"/>

    <!-- Whiskers -->
    <g stroke="#7a3b3b" stroke-width="3" stroke-linecap="round" opacity="0.9">
      <!-- Left -->
      <line x1="272" y1="252" x2="220" y2="245"/>
      <line x1="272" y1="258" x2="215" y2="258"/>
      <line x1="272" y1="264" x2="220" y2="272"/>
      <!-- Right -->
      <line x1="328" y1="252" x2="380" y2="245"/>
      <line x1="328" y1="258" x2="385" y2="258"/>
      <line x1="328" y1="264" x2="380" y2="272"/>
    </g>

    <!-- Front paws -->
    <ellipse cx="240" cy="520" rx="38" ry="26" fill="url(#furGrad)" stroke="#8c5a30" stroke-opacity="0.25" stroke-width="2"/>
    <ellipse cx="360" cy="520" rx="38" ry="26" fill="url(#furGrad)" stroke="#8c5a30" stroke-opacity="0.25" stroke-width="2"/>

    <!-- Toe beans -->
    <g fill="#f1ded0" opacity="0.95">
      <circle cx="228" cy="518" r="6"/>
      <circle cx="240" cy="525" r="6"/>
      <circle cx="252" cy="518" r="6"/>
      <circle cx="348" cy="518" r="6"/>
      <circle cx="360" cy="525" r="6"/>
      <circle cx="372" cy="518" r="6"/>
    </g>
  </g>
</svg>