410 lines
63 KiB
JavaScript
410 lines
63 KiB
JavaScript
// SVG ASSETS DATABASE
|
||
// High-quality vector graphics for core game elements.
|
||
// Offline-first, reliable, lightweight.
|
||
|
||
window.SVG_ASSETS = {
|
||
"default": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#805ad5"/><circle cx="256" cy="256" r="120" fill="#d6bcfa"/><path d="M256 200v100m-50-50h100" stroke="#805ad5" stroke-width="20" stroke-linecap="round"/></svg>`,
|
||
// --- SKILL CHECK ITEMS (EXISTING) ---
|
||
"Apple": `<svg viewBox="0 0 512 512"><circle cx="256" cy="256" r="256" fill="#e2e8f0"/><path d="M365.6 114.9c-23 0-51.5 10.9-74.6 28.5-16.1-17.6-45.9-28.5-74.6-28.5-62.9 0-109.4 57.3-109.4 128.7 0 94.9 66.8 228.4 125.6 228.4 23.3 0 42.6-16.5 61.4-16.5 19.8 0 35.5 16.5 61.4 16.5 56.5 0 120.6-125.1 120.6-228.4 0-71.4-44.5-128.7-110.4-128.7z" fill="#ff4d4d"/><path d="M291 143.4c0-43.2 21.6-82.5 56.8-103.4-3.5-2.2-7.8-3.4-12.2-3.4-36.1 0-65.4 29.3-65.4 65.4 0 16.5 6.1 31.6 16.2 43.2 1.6-0.6 3.1-1.2 4.6-1.8z" fill="#68d391"/></svg>`,
|
||
"Forest": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#2f855a"/><path d="M256 100l-120 180h60l-80 120h280l-80-120h60z" fill="#48bb78"/><rect x="236" y="400" width="40" height="60" fill="#744210"/></svg>`,
|
||
"Three": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="350" fill="white">3</text></svg>`,
|
||
"Bus": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6ad55"/><path d="M106 120h300c20 0 40 20 40 40v200c0 20-20 40-40 40h-300c-20 0-40-20-40-40v-200c0-20 20-40 40-40z" fill="#ecc94b"/><rect x="126" y="150" width="260" height="100" rx="10" fill="#4299e1"/><circle cx="156" cy="400" r="40" fill="#2d3748"/><circle cx="356" cy="400" r="40" fill="#2d3748"/></svg>`,
|
||
"Sport": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#e2e8f0"/><circle cx="180" cy="180" r="100" fill="#d4f34a"/><circle cx="332" cy="332" r="100" fill="#ed8936"/></svg>`,
|
||
"Cold": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#63b3ed"/><path d="M256 100v312M100 256h312" stroke="white" stroke-width="25" stroke-linecap="round"/></svg>`,
|
||
"Rain": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#2c5282"/><path d="M156 200c-30 0-50 20-50 50s20 50 50 50h200c40 0 70-30 70-70s-30-70-70-70c-10 0-20 2-30 5-10-30-40-50-70-50-40 0-70 25-80 60-5-2-15-5-20-5z" fill="#cbd5e0"/><path d="M180 350l-20 60M256 350l-20 60M332 350l-20 60" stroke="#63b3ed" stroke-width="15" stroke-linecap="round"/></svg>`,
|
||
"Hour": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#2d3748"/><circle cx="256" cy="256" r="180" fill="white"/><path d="M256 256v-100" stroke="#2d3748" stroke-width="15"/><path d="M256 256l60 60" stroke="#e53e3e" stroke-width="10"/></svg>`,
|
||
"Write": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6e05e"/><rect x="100" y="100" width="312" height="312" fill="white"/><path d="M350 100l100 100-200 200h-100v-100z" fill="#4299e1" transform="translate(50, -50)"/></svg>`,
|
||
"Banana": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fff5f5"/><path d="M380 120c-20-20-60-20-100 20-50 50-80 150-80 200 0 30 20 50 50 50 50 0 150-30 200-80" fill="#f6e05e" stroke="#d69e2e" stroke-width="10"/></svg>`,
|
||
"Dog": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#ed8936"/><circle cx="256" cy="256" r="120" fill="#fbd38d"/><circle cx="216" cy="236" r="15" fill="#2d3748"/><circle cx="296" cy="236" r="15" fill="#2d3748"/><path d="M256 295v30" stroke="#2d3748" stroke-width="5"/></svg>`,
|
||
"Cat": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#b794f4"/><circle cx="256" cy="280" r="130" fill="#2d3748"/><path d="M150 150l30-80 60 50" fill="#2d3748"/><path d="M362 150l-30-80-60 50" fill="#2d3748"/></svg>`,
|
||
"Car": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fed7d7"/><path d="M106 250h300l-40-80h-220z" fill="#e53e3e"/><rect x="86" y="250" width="340" height="100" rx="20" fill="#e53e3e"/><circle cx="156" cy="350" r="40" fill="#2d3748"/><circle cx="356" cy="350" r="40" fill="#2d3748"/></svg>`,
|
||
"House": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#c3dafe"/><path d="M256 100l180 150h-360z" fill="#e53e3e"/><rect x="106" y="250" width="300" height="200" fill="#fbd38d"/><rect x="226" y="330" width="60" height="120" fill="#744210"/></svg>`,
|
||
|
||
// --- NEW ANIMALS ---
|
||
"Lion": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6ad55"/><circle cx="256" cy="256" r="140" fill="#d69e2e"/><circle cx="256" cy="256" r="100" fill="#f6e05e"/><circle cx="220" cy="240" r="10" fill="black"/><circle cx="290" cy="240" r="10" fill="black"/><path d="M256 280l-20 30h40z" fill="#744210"/></svg>`,
|
||
"Tiger": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6ad55"/><circle cx="256" cy="256" r="120" fill="#ed8936"/><path d="M256 160l-20 40h40z" fill="black"/><path d="M180 256l40-10v20z" fill="black"/><path d="M332 256l-40-10v20z" fill="black"/><circle cx="220" cy="240" r="10" fill="black"/><circle cx="290" cy="240" r="10" fill="black"/></svg>`,
|
||
"Bear": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#90cdf4"/><circle cx="256" cy="256" r="120" fill="#744210"/><circle cx="180" cy="180" r="40" fill="#744210"/><circle cx="332" cy="180" r="40" fill="#744210"/><circle cx="256" cy="280" r="40" fill="#975a16"/><circle cx="256" cy="270" r="15" fill="black"/></svg>`,
|
||
"Wolf": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#2d3748"/><path d="M256 380L150 150l50 50 56-50 56 50 50-50z" fill="#a0aec0"/><circle cx="220" cy="250" r="10" fill="yellow"/><circle cx="290" cy="250" r="10" fill="yellow"/></svg>`,
|
||
"Fox": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#2c5282"/><path d="M256 380L150 150l50 50 56-50 56 50 50-50z" fill="#ed8936"/><path d="M256 380L200 250h112z" fill="white"/><circle cx="256" cy="350" r="10" fill="black"/></svg>`,
|
||
"Rabbit": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#68d391"/><ellipse cx="256" cy="300" rx="80" ry="100" fill="white"/><ellipse cx="220" cy="150" rx="30" ry="80" fill="white"/><ellipse cx="290" cy="150" rx="30" ry="80" fill="white"/><circle cx="220" cy="280" r="10" fill="red"/><circle cx="290" cy="280" r="10" fill="red"/></svg>`,
|
||
"Mouse": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f7fafc"/><circle cx="256" cy="256" r="100" fill="#a0aec0"/><circle cx="180" cy="180" r="60" fill="#a0aec0"/><circle cx="332" cy="180" r="60" fill="#a0aec0"/><circle cx="180" cy="180" r="40" fill="#feb2b2"/><circle cx="332" cy="180" r="40" fill="#feb2b2"/></svg>`,
|
||
"Elephant": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#4a5568"/><circle cx="256" cy="256" r="120" fill="#cbd5e0"/><circle cx="150" cy="256" r="60" fill="#cbd5e0"/><circle cx="362" cy="256" r="60" fill="#cbd5e0"/><path d="M256 280q-20 40 0 100" stroke="#cbd5e0" stroke-width="30" fill="none"/></svg>`,
|
||
"Monkey": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6e05e"/><circle cx="256" cy="256" r="120" fill="#744210"/><ellipse cx="256" cy="280" rx="80" ry="60" fill="#f6ad55"/><circle cx="150" cy="256" r="40" fill="#744210"/><circle cx="362" cy="256" r="40" fill="#744210"/></svg>`,
|
||
"Zebra": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><path d="M150 150h212v212H150z" fill="white"/><path d="M150 150l212 212M150 200l162 162M150 250l112 112" stroke="black" stroke-width="20"/></svg>`,
|
||
"Giraffe": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#68d391"/><rect x="226" y="100" width="60" height="300" fill="#ecc94b"/><circle cx="256" cy="100" r="50" fill="#ecc94b"/><circle cx="256" cy="150" r="10" fill="#744210"/><circle cx="256" cy="250" r="10" fill="#744210"/><circle cx="256" cy="350" r="10" fill="#744210"/></svg>`,
|
||
"Cow": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#90cdf4"/><circle cx="256" cy="256" r="120" fill="white"/><circle cx="220" cy="220" r="20" fill="black"/><path d="M280 200q20 20 40 0" stroke="black" stroke-width="20"/><rect x="236" y="280" width="40" height="40" fill="#f687b3"/></svg>`,
|
||
"Pig": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fed7d7"/><circle cx="256" cy="256" r="120" fill="#f687b3"/><ellipse cx="256" cy="280" rx="40" ry="30" fill="#d53f8c"/><circle cx="240" cy="280" r="5" fill="black"/><circle cx="270" cy="280" r="5" fill="black"/></svg>`,
|
||
"Sheep": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#68d391"/><circle cx="256" cy="256" r="100" fill="white"/><circle cx="256" cy="256" r="110" fill="none" stroke="white" stroke-width="20" stroke-dasharray="10 20"/><rect x="200" y="300" width="20" height="60" fill="black"/><rect x="290" y="300" width="20" height="60" fill="black"/></svg>`,
|
||
"Duck": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#63b3ed"/><path d="M150 300c0-50 40-100 100-100 40 0 60-40 60-60 0-20-20-40-40-40" stroke="#f6e05e" stroke-width="80" stroke-linecap="round" fill="none"/><circle cx="250" cy="200" r="10" fill="black"/><path d="M300 140l40 10-40 10" fill="#ed8936"/></svg>`,
|
||
|
||
// --- NUMBERS ---
|
||
"One": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="350" fill="white">1</text></svg>`,
|
||
"Two": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="350" fill="white">2</text></svg>`,
|
||
"Four": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="350" fill="white">4</text></svg>`,
|
||
"Five": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="350" fill="white">5</text></svg>`,
|
||
"Six": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="350" fill="white">6</text></svg>`,
|
||
"Seven": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="350" fill="white">7</text></svg>`,
|
||
"Eight": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="350" fill="white">8</text></svg>`,
|
||
"Nine": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="350" fill="white">9</text></svg>`,
|
||
"Ten": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="350" fill="white">10</text></svg>`,
|
||
"Eleven": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="300" fill="white">11</text></svg>`,
|
||
"Twelve": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="300" fill="white">12</text></svg>`,
|
||
"Twenty": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="250" fill="white">20</text></svg>`,
|
||
"Hundred": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="200" fill="white">100</text></svg>`,
|
||
|
||
// --- COLORS ---
|
||
"Red": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#e53e3e"/><circle cx="256" cy="256" r="150" fill="#c53030"/></svg>`,
|
||
"Blue": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#3182ce"/><circle cx="256" cy="256" r="150" fill="#2c5282"/></svg>`,
|
||
"Green": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#38a169"/><circle cx="256" cy="256" r="150" fill="#276749"/></svg>`,
|
||
"Yellow": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#ecc94b"/><circle cx="256" cy="256" r="150" fill="#d69e2e"/></svg>`,
|
||
"Black": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#1a202c"/><circle cx="256" cy="256" r="150" fill="#000000"/></svg>`,
|
||
"White": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#e2e8f0"/><circle cx="256" cy="256" r="150" fill="#ffffff"/></svg>`,
|
||
"Pink": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#ed64a6"/><circle cx="256" cy="256" r="150" fill="#d53f8c"/></svg>`,
|
||
"Purple": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#805ad5"/><circle cx="256" cy="256" r="150" fill="#553c9a"/></svg>`,
|
||
"Orange": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#ed8936"/><circle cx="256" cy="256" r="150" fill="#c05621"/></svg>`,
|
||
"Brown": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#744210"/><circle cx="256" cy="256" r="150" fill="#5a3d1a"/></svg>`,
|
||
"Grey": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#718096"/><circle cx="256" cy="256" r="150" fill="#4a5568"/></svg>`,
|
||
"Gold": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#d69e2e"/><circle cx="256" cy="256" r="150" fill="#b7791f"/></svg>`,
|
||
"Silver": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#a0aec0"/><circle cx="256" cy="256" r="150" fill="#718096"/></svg>`,
|
||
"Violet": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#6b46c1"/><circle cx="256" cy="256" r="150" fill="#553c9a"/></svg>`,
|
||
"Indigo": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#4c51bf"/><circle cx="256" cy="256" r="150" fill="#312e81"/></svg>`,
|
||
"Turquoise": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#38b2ac"/><circle cx="256" cy="256" r="150" fill="#2c7a7b"/></svg>`,
|
||
"Beige": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f7fafc"/><circle cx="256" cy="256" r="150" fill="#e2e8f0"/></svg>`,
|
||
"First": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="250" fill="white">1st</text></svg>`,
|
||
"Second": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="250" fill="white">2nd</text></svg>`,
|
||
"Third": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="bold" font-size="250" fill="white">3rd</text></svg>`,
|
||
"Plus": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#48bb78"/><path d="M256 150v212M150 256h212" stroke="white" stroke-width="40" stroke-linecap="round"/></svg>`,
|
||
"Mother": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f687b3"/><circle cx="256" cy="200" r="60" fill="#fbb6ce"/><path d="M256 260v100M200 320h112" stroke="#fbb6ce" stroke-width="20" stroke-linecap="round"/></svg>`,
|
||
"Grandmother": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f687b3"/><circle cx="256" cy="200" r="60" fill="#fbb6ce"/><path d="M220 180h72" stroke="white" stroke-width="5" stroke-linecap="round"/><path d="M256 260v100M200 320h112" stroke="#fbb6ce" stroke-width="20" stroke-linecap="round"/></svg>`,
|
||
"Grandfather": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#90cdf4"/><circle cx="256" cy="200" r="60" fill="#bee3f8"/><path d="M220 180h72" stroke="white" stroke-width="5" stroke-linecap="round"/><path d="M256 260v100M200 320h112" stroke="#bee3f8" stroke-width="20" stroke-linecap="round"/></svg>`,
|
||
"Son": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#90cdf4"/><circle cx="256" cy="200" r="50" fill="#bee3f8"/><path d="M256 250v80M210 310h92" stroke="#bee3f8" stroke-width="15" stroke-linecap="round"/></svg>`,
|
||
"Aunt": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f687b3"/><circle cx="256" cy="200" r="60" fill="#fbb6ce"/><path d="M256 260v100M200 320h112" stroke="#fbb6ce" stroke-width="20" stroke-linecap="round"/></svg>`,
|
||
"Cousin": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#c6f6d5"/><circle cx="256" cy="200" r="50" fill="#9ae6b4"/><path d="M256 250v80M210 310h92" stroke="#9ae6b4" stroke-width="15" stroke-linecap="round"/></svg>`,
|
||
"Woman": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f687b3"/><circle cx="256" cy="200" r="60" fill="#fbb6ce"/><path d="M256 260v100M200 320h112" stroke="#fbb6ce" stroke-width="20" stroke-linecap="round"/></svg>`,
|
||
"Boy": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#90cdf4"/><circle cx="256" cy="200" r="50" fill="#bee3f8"/><path d="M256 250v80M210 310h92" stroke="#bee3f8" stroke-width="15" stroke-linecap="round"/></svg>`,
|
||
"Wife": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f687b3"/><circle cx="256" cy="200" r="60" fill="#fbb6ce"/><path d="M256 260v100M200 320h112" stroke="#fbb6ce" stroke-width="20" stroke-linecap="round"/></svg>`,
|
||
"Water": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#bee3f8"/><path d="M256 150c-50 0-90 40-90 90 0 60 90 150 90 150s90-90 90-150c0-50-40-90-90-90z" fill="#63b3ed"/></svg>`,
|
||
"Cheese": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6e05e"/><path d="M150 200h212v150H150z" fill="#f6ad55"/><circle cx="200" cy="250" r="15" fill="#f687b3"/><circle cx="250" cy="280" r="15" fill="#f687b3"/><circle cx="300" cy="250" r="15" fill="#f687b3"/></svg>`,
|
||
"Meat": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fc8181"/><ellipse cx="256" cy="256" rx="100" ry="60" fill="#e53e3e"/><ellipse cx="256" cy="256" rx="80" ry="40" fill="#c53030"/></svg>`,
|
||
"Cake": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbb6ce"/><rect x="150" y="250" width="212" height="100" fill="#f687b3"/><rect x="150" y="200" width="212" height="50" fill="#fce7f3"/><circle cx="256" cy="175" r="25" fill="#fbb6ce"/></svg>`,
|
||
|
||
// --- BODY PARTS ---
|
||
"Hand": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbd38d"/><path d="M256 150c-50 0-90 40-90 90v100c0 20 20 40 40 40h100c20 0 40-20 40-40v-100c0-50-40-90-90-90z" fill="#f6ad55"/><circle cx="200" cy="200" r="20" fill="#f6e05e"/><circle cx="312" cy="200" r="20" fill="#f6e05e"/><circle cx="256" cy="350" r="20" fill="#f6e05e"/></svg>`,
|
||
"Eye": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#e2e8f0"/><ellipse cx="256" cy="256" rx="150" ry="100" fill="white"/><circle cx="256" cy="256" r="50" fill="#2d3748"/><circle cx="276" cy="236" r="20" fill="white"/></svg>`,
|
||
"Ear": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbd38d"/><path d="M256 150c-80 0-100 100-100 150s20 100 100 100 100-50 100-100-20-150-100-150z" fill="#f6ad55"/><path d="M256 180c-50 0-70 70-70 120s20 70 70 70 70-30 70-70-20-120-70-120z" fill="#f6e05e"/></svg>`,
|
||
"Face": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbd38d"/><circle cx="256" cy="256" r="150" fill="#f6ad55"/><circle cx="200" cy="220" r="20" fill="#2d3748"/><circle cx="312" cy="220" r="20" fill="#2d3748"/><path d="M200 300q56 50 112 0" stroke="#744210" stroke-width="10" fill="none"/></svg>`,
|
||
"Finger": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbd38d"/><rect x="236" y="100" width="40" height="300" rx="20" fill="#f6ad55"/></svg>`,
|
||
"Shoulder": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbd38d"/><path d="M100 256c0-50 100-100 156-100s156 50 156 100-100 100-156 100-156-50-156-100z" fill="#f6ad55"/></svg>`,
|
||
"Neck": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbd38d"/><rect x="206" y="150" width="100" height="200" fill="#f6ad55"/></svg>`,
|
||
"Back": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbd38d"/><rect x="100" y="100" width="312" height="312" fill="#f6ad55"/></svg>`,
|
||
"Stomach": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbd38d"/><ellipse cx="256" cy="256" rx="120" ry="150" fill="#f6ad55"/></svg>`,
|
||
"Brain": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbd38d"/><path d="M256 100c-80 0-100 100-100 150s20 100 100 100 100-50 100-100-20-150-100-150z" fill="#f6ad55"/><path d="M256 120c-50 0-70 70-70 120s20 70 70 70 70-30 70-70-20-120-70-120z" fill="#f6e05e"/></svg>`,
|
||
|
||
// --- CLOTHING ---
|
||
"Shirt": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#90cdf4"/><path d="M100 150h312l-50 100v100h-212v-100z" fill="#bee3f8"/></svg>`,
|
||
"Pants": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#4c51bf"/><rect x="150" y="150" width="212" height="250" fill="#667eea"/><rect x="150" y="250" width="106" height="150" fill="#5a67d8"/><rect x="256" y="250" width="106" height="150" fill="#5a67d8"/></svg>`,
|
||
"Dress": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#ed64a6"/><path d="M100 150h312l-100 250h-112z" fill="#d53f8c"/></svg>`,
|
||
"Shoes": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#744210"/><path d="M100 300h312l-50 50h-212z" fill="#975a16"/></svg>`,
|
||
"Hat": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#744210"/><path d="M100 300h312l-50-100h-212z" fill="#975a16"/><circle cx="256" cy="200" r="50" fill="#744210"/></svg>`,
|
||
"Socks": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#e2e8f0"/><rect x="150" y="150" width="212" height="212" fill="white"/><path d="M150 150l212 212M150 250l112 112" stroke="#cbd5e0" stroke-width="10"/></svg>`,
|
||
"Jacket": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#2d3748"/><path d="M100 150h312l-50 100v100h-212v-100z" fill="#4a5568"/><rect x="200" y="150" width="112" height="200" fill="#2d3748"/></svg>`,
|
||
|
||
// --- HOUSEHOLD ITEMS ---
|
||
"Table": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#744210"/><rect x="100" y="200" width="312" height="50" fill="#975a16"/><rect x="120" y="250" width="20" height="150" fill="#744210"/><rect x="372" y="250" width="20" height="150" fill="#744210"/></svg>`,
|
||
"Chair": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#744210"/><rect x="150" y="150" width="212" height="50" fill="#975a16"/><rect x="150" y="200" width="20" height="150" fill="#744210"/><rect x="342" y="200" width="20" height="150" fill="#744210"/><rect x="150" y="350" width="212" height="20" fill="#975a16"/></svg>`,
|
||
"Bed": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#e2e8f0"/><rect x="100" y="200" width="312" height="150" fill="white"/><rect x="100" y="150" width="312" height="50" fill="#cbd5e0"/></svg>`,
|
||
"Lamp": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6e05e"/><path d="M200 100h112l-56 150z" fill="#ecc94b"/><rect x="246" y="250" width="20" height="150" fill="#744210"/><circle cx="256" cy="400" r="20" fill="#744210"/></svg>`,
|
||
"Door": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#744210"/><rect x="150" y="100" width="212" height="312" fill="#975a16"/><circle cx="320" cy="256" r="20" fill="#2d3748"/></svg>`,
|
||
"Window": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#bee3f8"/><rect x="150" y="150" width="212" height="212" fill="#90cdf4"/><path d="M256 150v212M150 256h212" stroke="white" stroke-width="10"/></svg>`,
|
||
"Book": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#805ad5"/><rect x="150" y="150" width="212" height="212" fill="#d6bcfa"/><rect x="170" y="170" width="172" height="172" fill="white"/></svg>`,
|
||
"Television": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#2d3748"/><rect x="100" y="100" width="312" height="212" fill="#4a5568"/><rect x="150" y="312" width="212" height="50" fill="#2d3748"/></svg>`,
|
||
"Phone": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#2d3748"/><rect x="150" y="100" width="212" height="312" fill="#4a5568"/><rect x="170" y="120" width="172" height="172" fill="white"/><circle cx="256" cy="350" r="20" fill="#718096"/></svg>`,
|
||
|
||
// --- NATURE ---
|
||
"Tree": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#68d391"/><circle cx="256" cy="200" r="100" fill="#48bb78"/><rect x="236" y="300" width="40" height="100" fill="#744210"/></svg>`,
|
||
"Flower": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbb6ce"/><circle cx="256" cy="256" r="50" fill="#f6e05e"/><circle cx="256" cy="180" r="40" fill="#f687b3"/><circle cx="320" cy="220" r="40" fill="#f687b3"/><circle cx="320" cy="292" r="40" fill="#f687b3"/><circle cx="256" cy="332" r="40" fill="#f687b3"/><circle cx="192" cy="292" r="40" fill="#f687b3"/><circle cx="192" cy="220" r="40" fill="#f687b3"/></svg>`,
|
||
"Sun": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6e05e"/><circle cx="256" cy="256" r="150" fill="#ecc94b"/><path d="M256 50v50M256 412v50M50 256h50M412 256h50M120 120l35 35M357 357l35 35M120 392l35-35M357 155l35-35" stroke="#ecc94b" stroke-width="20" stroke-linecap="round"/></svg>`,
|
||
"Moon": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#2d3748"/><circle cx="200" cy="256" r="150" fill="#e2e8f0"/><circle cx="250" cy="200" r="150" fill="#2d3748"/></svg>`,
|
||
"Star": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6e05e"/><path d="M256 50l60 120 130 20-90 100 20 130-120-60-120 60 20-130-90-100 130-20z" fill="#ecc94b"/></svg>`,
|
||
"Cloud": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#e2e8f0"/><path d="M150 300c-30 0-50 20-50 50s20 50 50 50h200c40 0 70-30 70-70s-30-70-70-70c-10 0-20 2-30 5-10-30-40-50-70-50-40 0-70 25-80 60-5-2-15-5-20-5z" fill="white"/></svg>`,
|
||
"River": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#bee3f8"/><path d="M100 200q100 50 200 0t200 0" stroke="#63b3ed" stroke-width="50" fill="none"/></svg>`,
|
||
"Mountain": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#a0aec0"/><path d="M100 412l156-212 156 212z" fill="#718096"/></svg>`,
|
||
|
||
// --- ACTIONS ---
|
||
"Run": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#48bb78"/><path d="M256 150c-30 0-50 20-50 50s20 50 50 50 50-20 50-50-20-50-50-50z" fill="white"/><path d="M256 250v100M200 300l-50 50M312 300l50 50" stroke="white" stroke-width="20" stroke-linecap="round"/></svg>`,
|
||
"Jump": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#48bb78"/><path d="M256 150c-30 0-50 20-50 50s20 50 50 50 50-20 50-50-20-50-50-50z" fill="white"/><path d="M256 250l-50-50M256 250l50-50M200 300l-50 50M312 300l50 50" stroke="white" stroke-width="20" stroke-linecap="round"/></svg>`,
|
||
"Sleep": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#2d3748"/><path d="M150 256h212" stroke="white" stroke-width="20" stroke-linecap="round"/><circle cx="180" cy="256" r="20" fill="white"/></svg>`,
|
||
"Eat": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6ad55"/><path d="M150 256h212" stroke="white" stroke-width="20" stroke-linecap="round"/><circle cx="180" cy="256" r="20" fill="white"/><path d="M256 150c-50 0-90 40-90 90 0 60 90 150 90 150s90-90 90-150c0-50-40-90-90-90z" fill="#ff4d4d"/></svg>`,
|
||
"Drink": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#bee3f8"/><rect x="200" y="100" width="112" height="250" fill="#90cdf4"/><path d="M200 100h112l-20-50h-72z" fill="#90cdf4"/></svg>`,
|
||
"Read": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#805ad5"/><rect x="150" y="150" width="212" height="212" fill="#d6bcfa"/><rect x="170" y="170" width="172" height="172" fill="white"/><path d="M170 170l172 172M170 250h172" stroke="#805ad5" stroke-width="5"/></svg>`,
|
||
"Play": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6e05e"/><circle cx="256" cy="256" r="100" fill="#ecc94b"/><path d="M220 200l100 56-100 56z" fill="white"/></svg>`,
|
||
"Sing": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#ed64a6"/><path d="M256 150c-30 0-50 20-50 50s20 50 50 50 50-20 50-50-20-50-50-50z" fill="white"/><path d="M256 250v100M200 300l-50 50M312 300l50 50" stroke="white" stroke-width="20" stroke-linecap="round"/><path d="M100 200q50-50 100 0" stroke="white" stroke-width="10" fill="none"/></svg>`,
|
||
"Dance": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#ed64a6"/><path d="M256 150c-30 0-50 20-50 50s20 50 50 50 50-20 50-50-20-50-50-50z" fill="white"/><path d="M256 250v100M200 300l-50 50M312 300l50 50" stroke="white" stroke-width="20" stroke-linecap="round"/><path d="M100 250q50 50 100 0" stroke="white" stroke-width="10" fill="none"/></svg>`,
|
||
"Walk": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#48bb78"/><path d="M256 150c-30 0-50 20-50 50s20 50 50 50 50-20 50-50-20-50-50-50z" fill="white"/><path d="M256 250v100M200 300l-50 50M312 300l50 50" stroke="white" stroke-width="20" stroke-linecap="round"/><path d="M100 350h312" stroke="white" stroke-width="10" fill="none"/></svg>`
|
||
"Chocolate": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#744210"/><rect x="150" y="150" width="80" height="80" fill="#5a3d1a"/><rect x="240" y="150" width="80" height="80" fill="#5a3d1a"/><rect x="330" y="150" width="80" height="80" fill="#5a3d1a"/><rect x="150" y="240" width="80" height="80" fill="#5a3d1a"/><rect x="240" y="240" width="80" height="80" fill="#5a3d1a"/><rect x="330" y="240" width="80" height="80" fill="#5a3d1a"/></svg>`,
|
||
"Juice": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbb6ce"/><path d="M200 150h112v200H200z" fill="#f687b3"/><rect x="220" y="130" width="72" height="30" fill="#fce7f3"/><path d="M256 170v100" stroke="white" stroke-width="10"/></svg>`,
|
||
"Coffee": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#744210"/><path d="M200 200h112v150H200z" fill="#5a3d1a"/><path d="M312 250h40v50h-40z" fill="#5a3d1a"/><path d="M200 200h112v30H200z" fill="#3e2723"/></svg>`,
|
||
"Potato": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6e05e"/><ellipse cx="256" cy="256" rx="100" ry="80" fill="#d69e2e"/><circle cx="230" cy="240" r="10" fill="#744210"/><circle cx="280" cy="260" r="10" fill="#744210"/><circle cx="250" cy="280" r="10" fill="#744210"/></svg>`,
|
||
"Cream": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fffff0"/><circle cx="256" cy="256" r="150" fill="#faf089"/></svg>`,
|
||
"Dark": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#1a202c"/><circle cx="256" cy="256" r="150" fill="#000000"/></svg>`,
|
||
"Light": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#e2e8f0"/><circle cx="256" cy="256" r="150" fill="#ffffff"/></svg>`,
|
||
|
||
// --- RUSSIAN WORDS ---
|
||
"Собака": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#ed8936"/><circle cx="256" cy="256" r="120" fill="#fbd38d"/><circle cx="216" cy="236" r="15" fill="#2d3748"/><circle cx="296" cy="236" r="15" fill="#2d3748"/><path d="M256 295v30" stroke="#2d3748" stroke-width="5"/></svg>`,
|
||
"Рыба": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#4299e1"/><path d="M150 256c0-50 40-100 100-100 40 0 60-40 60-60 0-20-20-40-40-40" stroke="#63b3ed" stroke-width="80" stroke-linecap="round" fill="none"/><circle cx="250" cy="200" r="10" fill="black"/><path d="M300 140l40 10-40 10" fill="#ed8936"/></svg>`,
|
||
"Птица": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6e05e"/><path d="M256 200l-80 60h160z" fill="#d69e2e"/><path d="M256 200l-40-60 40 60 40-60z" fill="#d69e2e"/><circle cx="256" cy="200" r="10" fill="black"/></svg>`,
|
||
"Тигр": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6ad55"/><circle cx="256" cy="256" r="120" fill="#ed8936"/><path d="M256 160l-20 40h40z" fill="black"/><path d="M180 256l40-10v20z" fill="black"/><path d="M332 256l-40-10v20z" fill="black"/><circle cx="220" cy="240" r="10" fill="black"/><circle cx="290" cy="240" r="10" fill="black"/></svg>`,
|
||
"Обезьяна": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f6e05e"/><circle cx="256" cy="256" r="120" fill="#744210"/><ellipse cx="256" cy="280" rx="80" ry="60" fill="#f6ad55"/><circle cx="150" cy="256" r="40" fill="#744210"/><circle cx="362" cy="256" r="40" fill="#744210"/></svg>`,
|
||
"Зебра": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#667eea"/><path d="M150 150h212v212H150z" fill="white"/><path d="M150 150l212 212M150 200l162 162M150 250l112 112" stroke="black" stroke-width="20"/></svg>`,
|
||
"Корова": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#90cdf4"/><circle cx="256" cy="256" r="120" fill="white"/><circle cx="220" cy="220" r="20" fill="black"/><path d="M280 200q20 20 40 0" stroke="black" stroke-width="20"/><rect x="236" y="280" width="40" height="40" fill="#f687b3"/></svg>`,
|
||
"Свинья": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fed7d7"/><circle cx="256" cy="256" r="120" fill="#f687b3"/><ellipse cx="256" cy="280" rx="40" ry="30" fill="#d53f8c"/><circle cx="240" cy="280" r="5" fill="black"/><circle cx="270" cy="280" r="5" fill="black"/></svg>`,
|
||
"Овца": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#68d391"/><circle cx="256" cy="256" r="100" fill="white"/><circle cx="256" cy="256" r="110" fill="none" stroke="white" stroke-width="20" stroke-dasharray="10 20"/><rect x="200" y="300" width="20" height="60" fill="black"/><rect x="290" y="300" width="20" height="60" fill="black"/></svg>`,
|
||
"Лошадь": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#a0aec0"/><path d="M150 250h212l-30-80h-152z" fill="#744210"/><rect x="130" y="250" width="252" height="100" rx="20" fill="#744210"/><circle cx="180" cy="350" r="30" fill="#2d3748"/><circle cx="332" cy="350" r="30" fill="#2d3748"/></svg>`,
|
||
"Синий": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#3182ce"/><circle cx="256" cy="256" r="150" fill="#2c5282"/></svg>`,
|
||
"Желтый": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#ecc94b"/><circle cx="256" cy="256" r="150" fill="#d69e2e"/></svg>`,
|
||
"Белый": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#e2e8f0"/><circle cx="256" cy="256" r="150" fill="#ffffff"/></svg>`,
|
||
"Розовый": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#ed64a6"/><circle cx="256" cy="256" r="150" fill="#d53f8c"/></svg>`,
|
||
"Фиолетовый": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#805ad5"/><circle cx="256" cy="256" r="150" fill="#553c9a"/></svg>`,
|
||
"Оранжевый": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#ed8936"/><circle cx="256" cy="256" r="150" fill="#c05621"/></svg>`,
|
||
"Серый": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#718096"/><circle cx="256" cy="256" r="150" fill="#4a5568"/></svg>`,
|
||
"Индиго": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#4c51bf"/><circle cx="256" cy="256" r="150" fill="#312e81"/></svg>`,
|
||
"Кремовый": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fffff0"/><circle cx="256" cy="256" r="150" fill="#faf089"/></svg>`,
|
||
"Темный": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#1a202c"/><circle cx="256" cy="256" r="150" fill="#000000"/></svg>`,
|
||
"Светлый": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#e2e8f0"/><circle cx="256" cy="256" r="150" fill="#ffffff"/></svg>`,
|
||
"Минус": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#e53e3e"/><path d="M100 256h312" stroke="white" stroke-width="25" stroke-linecap="round"/></svg>`,
|
||
"Мать": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f687b3"/><circle cx="256" cy="256" r="100" fill="#fbd38d"/><circle cx="220" cy="240" r="10" fill="#2d3748"/><circle cx="290" cy="240" r="10" fill="#2d3748"/><path d="M256 280v30" stroke="#2d3748" stroke-width="5"/></svg>`,
|
||
"Папа": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#4299e1"/><circle cx="256" cy="256" r="100" fill="#fbd38d"/><circle cx="220" cy="240" r="10" fill="#2d3748"/><circle cx="290" cy="240" r="10" fill="#2d3748"/><path d="M256 280v30" stroke="#2d3748" stroke-width="5"/></svg>`,
|
||
"Сестра": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f687b3"/><circle cx="256" cy="256" r="80" fill="#fbd38d"/><circle cx="230" cy="240" r="8" fill="#2d3748"/><circle cx="280" cy="240" r="8" fill="#2d3748"/><path d="M256 270v20" stroke="#2d3748" stroke-width="4"/></svg>`,
|
||
"Брат": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#4299e1"/><circle cx="256" cy="256" r="80" fill="#fbd38d"/><circle cx="230" cy="240" r="8" fill="#2d3748"/><circle cx="280" cy="240" r="8" fill="#2d3748"/><path d="M256 270v20" stroke="#2d3748" stroke-width="4"/></svg>`,
|
||
"Дочь": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f687b3"/><circle cx="256" cy="256" r="60" fill="#fbd38d"/><circle cx="235" cy="240" r="6" fill="#2d3748"/><circle cx="275" cy="240" r="6" fill="#2d3748"/><path d="M256 265v15" stroke="#2d3748" stroke-width="3"/></svg>`,
|
||
"Дядя": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#4299e1"/><circle cx="256" cy="256" r="90" fill="#fbd38d"/><circle cx="225" cy="240" r="9" fill="#2d3748"/><circle cx="285" cy="240" r="9" fill="#2d3748"/><path d="M256 275v25" stroke="#2d3748" stroke-width="4"/></svg>`,
|
||
"Родители": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#9f7aea"/><circle cx="200" cy="256" r="80" fill="#fbd38d"/><circle cx="312" cy="256" r="80" fill="#fbd38d"/><circle cx="200" cy="240" r="8" fill="#2d3748"/><circle cx="312" cy="240" r="8" fill="#2d3748"/><path d="M200 270v20M312 270v20" stroke="#2d3748" stroke-width="4"/></svg>`,
|
||
"Семья": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#9f7aea"/><circle cx="150" cy="256" r="60" fill="#fbd38d"/><circle cx="256" cy="256" r="60" fill="#fbd38d"/><circle cx="362" cy="256" r="60" fill="#fbd38d"/><circle cx="150" cy="240" r="6" fill="#2d3748"/><circle cx="256" cy="240" r="6" fill="#2d3748"/><circle cx="362" cy="240" r="6" fill="#2d3748"/></svg>`,
|
||
"Малыш": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f687b3"/><circle cx="256" cy="256" r="50" fill="#fbd38d"/><circle cx="240" cy="240" r="5" fill="#2d3748"/><circle cx="270" cy="240" r="5" fill="#2d3748"/><path d="M256 260v10" stroke="#2d3748" stroke-width="3"/></svg>`,
|
||
"Мужчина": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#4299e1"/><circle cx="256" cy="256" r="100" fill="#fbd38d"/><circle cx="220" cy="240" r="10" fill="#2d3748"/><circle cx="290" cy="240" r="10" fill="#2d3748"/><path d="M256 280v30" stroke="#2d3748" stroke-width="5"/></svg>`,
|
||
"Девочка": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f687b3"/><circle cx="256" cy="256" r="70" fill="#fbd38d"/><circle cx="235" cy="240" r="7" fill="#2d3748"/><circle cx="275" cy="240" r="7" fill="#2d3748"/><path d="M256 270v20" stroke="#2d3748" stroke-width="4"/></svg>`,
|
||
"Друг": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#4299e1"/><circle cx="200" cy="256" r="70" fill="#fbd38d"/><circle cx="312" cy="256" r="70" fill="#fbd38d"/><circle cx="200" cy="240" r="7" fill="#2d3748"/><circle cx="312" cy="240" r="7" fill="#2d3748"/><path d="M200 270v20M312 270v20" stroke="#2d3748" stroke-width="4"/></svg>`,
|
||
"Жена": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f687b3"/><circle cx="256" cy="256" r="85" fill="#fbd38d"/><circle cx="230" cy="240" r="8" fill="#2d3748"/><circle cx="280" cy="240" r="8" fill="#2d3748"/><path d="M256 270v20" stroke="#2d3748" stroke-width="4"/></svg>`,
|
||
"Яблоко": `<svg viewBox="0 0 512 512"><circle cx="256" cy="256" r="256" fill="#e2e8f0"/><path d="M365.6 114.9c-23 0-51.5 10.9-74.6 28.5-16.1-17.6-45.9-28.5-74.6-28.5-62.9 0-109.4 57.3-109.4 128.7 0 94.9 66.8 228.4 125.6 228.4 23.3 0 42.6-16.5 61.4-16.5 19.8 0 35.5 16.5 61.4 16.5 56.5 0 120.6-125.1 120.6-228.4 0-71.4-44.5-128.7-110.4-128.7z" fill="#ff4d4d"/><path d="M291 143.4c0-43.2 21.6-82.5 56.8-103.4-3.5-2.2-7.8-3.4-12.2-3.4-36.1 0-65.4 29.3-65.4 65.4 0 16.5 6.1 31.6 16.2 43.2 1.6-0.6 3.1-1.2 4.6-1.8z" fill="#68d391"/></svg>`,
|
||
"Апельсин": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fed7aa"/><circle cx="256" cy="256" r="120" fill="#fb923c"/><circle cx="256" cy="256" r="100" fill="none" stroke="#ea580c" stroke-width="5"/></svg>`,
|
||
"Хлеб": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#f3e8d0"/><ellipse cx="256" cy="280" rx="120" ry="80" fill="#d97706"/><ellipse cx="256" cy="260" rx="100" ry="60" fill="#f59e0b"/></svg>`,
|
||
"Молоко": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#e0f2fe"/><path d="M200 150h112v200H200z" fill="white"/><path d="M200 150h112l20 40H180z" fill="#3b82f6"/><rect x="240" y="120" width="32" height="40" fill="#3b82f6"/></svg>`,
|
||
"Яйцо": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fef3c7"/><ellipse cx="256" cy="280" rx="80" ry="100" fill="white"/><ellipse cx="256" cy="260" rx="60" ry="80" fill="#fef3c7"/></svg>`,
|
||
"Курица (еда)": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fed7aa"/><ellipse cx="256" cy="280" rx="100" ry="80" fill="#dc2626"/><ellipse cx="256" cy="260" rx="80" ry="60" fill="#ef4444"/></svg>`,
|
||
"Рыба (еда)": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#dbeafe"/><path d="M150 256c0-50 40-100 100-100 40 0 60-40 60-60 0-20-20-40-40-40" stroke="#3b82f6" stroke-width="80" stroke-linecap="round" fill="none"/><circle cx="250" cy="200" r="10" fill="black"/><path d="M300 140l40 10-40 10" fill="#f59e0b"/></svg>`,
|
||
"Пицца": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fef3c7"/><path d="M256 150l120 120-120 120-120-120z" fill="#dc2626"/><circle cx="220" cy="220" r="15" fill="#fbbf24"/><circle cx="290" cy="220" r="15" fill="#10b981"/><circle cx="256" cy="290" r="15" fill="#8b5cf6"/></svg>`,
|
||
"Чай": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fef3c7"/><path d="M200 200h112v100H200z" fill="#92400e"/><ellipse cx="256" cy="200" rx="56" ry="10" fill="#78350f"/><path d="M312 250h40v50h-40z" fill="#92400e"/></svg>`,
|
||
"Картофель": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fef3c7"/><ellipse cx="256" cy="280" rx="100" ry="80" fill="#a16207"/><ellipse cx="220" cy="260" rx="30" ry="20" fill="#92400e"/><ellipse cx="290" cy="290" rx="25" ry="20" fill="#92400e"/></svg>`,
|
||
"Помидор": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fee2e2"/><circle cx="256" cy="280" r="80" fill="#dc2626"/><circle cx="256" cy="260" r="60" fill="#ef4444"/><path d="M256 200l-10 20h20z" fill="#16a34a"/></svg>`,
|
||
"Нога": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><rect x="226" y="200" width="60" height="200" rx="30" fill="#f59e0b"/><circle cx="256" cy="400" r="40" fill="#f59e0b"/></svg>`,
|
||
"Голова": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><circle cx="256" cy="256" r="100" fill="#f59e0b"/><circle cx="220" cy="240" r="10" fill="#2d3748"/><circle cx="290" cy="240" r="10" fill="#2d3748"/><path d="M256 280v30" stroke="#2d3748" stroke-width="5"/></svg>`,
|
||
"Нос": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M256 200l-30 80h60z" fill="#f59e0b"/><circle cx="256" cy="280" r="15" fill="#dc2626"/></svg>`,
|
||
"Ухо": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 200c0-30 20-50 50-50 20 0 40 20 40 50v100c0 20-20 40-40 40-30 0-50-20-50-40z" fill="#f59e0b"/></svg>`,
|
||
"Рот": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><ellipse cx="256" cy="280" rx="60" ry="30" fill="#dc2626"/><ellipse cx="256" cy="270" rx="40" ry="20" fill="#ef4444"/></svg>`,
|
||
"Зуб": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M236 200h40v150h-40z" fill="white"/><path d="M236 200h40v30h-40z" fill="#e5e7eb"/></svg>`,
|
||
"Волосы": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 150c0-30 20-50 50-50 20 0 40 20 40 50v50c0 20-20 40-40 40-30 0-50-20-50-40z" fill="#92400e"/></svg>`,
|
||
"Лицо": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><circle cx="256" cy="256" r="120" fill="#f59e0b"/><circle cx="220" cy="240" r="10" fill="#2d3748"/><circle cx="290" cy="240" r="10" fill="#2d3748"/><path d="M256 280v30" stroke="#2d3748" stroke-width="5"/></svg>`,
|
||
"Палец": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><rect x="236" y="200" width="40" height="100" rx="20" fill="#f59e0b"/><circle cx="256" cy="200" r="25" fill="#f59e0b"/></svg>`,
|
||
"Ступня": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><ellipse cx="256" cy="300" rx="80" ry="40" fill="#f59e0b"/><ellipse cx="230" cy="280" rx="15" ry="10" fill="#f59e0b"/><ellipse cx="280" cy="280" rx="15" ry="10" fill="#f59e0b"/></svg>`,
|
||
"Колено": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><circle cx="256" cy="280" r="50" fill="#f59e0b"/><circle cx="256" cy="280" r="30" fill="#d97706"/></svg>`,
|
||
"Плечо": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><circle cx="256" cy="256" r="60" fill="#f59e0b"/><rect x="226" y="200" width="60" height="100" rx="30" fill="#f59e0b"/></svg>`,
|
||
"Шея": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><rect x="236" y="200" width="40" height="100" rx="20" fill="#f59e0b"/></svg>`,
|
||
"Спина": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 150h112v200H200z" fill="#f59e0b"/><path d="M200 150h112v30H200z" fill="#d97706"/></svg>`,
|
||
"Живот": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><ellipse cx="256" cy="280" rx="100" ry="80" fill="#f59e0b"/><ellipse cx="256" cy="270" rx="80" ry="60" fill="#fbbf24"/></svg>`,
|
||
"Сердце": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M256 350c-50-50-100-100-100-150 0-30 20-50 50-50 20 0 40 20 50 30 10-10 30-30 50-30 30 0 50 20 50 50 0 50-50 100-100 150z" fill="#dc2626"/></svg>`,
|
||
"Мозг": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 200c0-30 20-50 50-50 20 0 40 20 40 50v100c0 20-20 40-40 40-30 0-50-20-50-40z" fill="#ef4444"/><path d="M272 200c0-30 20-50 50-50 20 0 40 20 40 50v100c0 20-20 40-40 40-30 0-50-20-50-40z" fill="#ef4444"/></svg>`,
|
||
"Кость": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 250h112v20H200z" fill="#f5f5f4"/><circle cx="200" cy="260" r="20" fill="#f5f5f4"/><circle cx="312" cy="260" r="20" fill="#f5f5f4"/></svg>`,
|
||
"Шляпа": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 250h112v30H200z" fill="#1e40af"/><ellipse cx="256" cy="280" rx="80" ry="10" fill="#1e40af"/></svg>`,
|
||
"Рубашка": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 200h112v150H200z" fill="#3b82f6"/><path d="M200 200h112v30H200z" fill="#1e40af"/><path d="M236 200v30M276 200v30" stroke="#1e40af" stroke-width="5"/></svg>`,
|
||
"Платье": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 200h112v180H200z" fill="#ec4899"/><path d="M200 200h112v30H200z" fill="#be185d"/><path d="M236 200v30M276 200v30" stroke="#be185d" stroke-width="5"/></svg>`,
|
||
"Юбка": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 250h112v100H200z" fill="#ec4899"/><path d="M200 250h112v20H200z" fill="#be185d"/></svg>`,
|
||
"Брюки": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 200h50v150h-50z" fill="#3b82f6"/><path d="M262 200h50v150h-50z" fill="#3b82f6"/><path d="M200 200h112v30H200z" fill="#1e40af"/></svg>`,
|
||
"Джинсы": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 200h50v150h-50z" fill="#1e40af"/><path d="M262 200h50v150h-50z" fill="#1e40af"/><path d="M200 200h112v30H200z" fill="#1e3a8a"/></svg>`,
|
||
"Обувь": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 300h112v50H200z" fill="#1e40af"/><ellipse cx="256" cy="350" rx="60" ry="20" fill="#1e40af"/></svg>`,
|
||
"Носки": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M220 200h30v120h-30z" fill="#f5f5f4"/><path d="M262 200h30v120h-30z" fill="#f5f5f4"/></svg>`,
|
||
"Пальто": `<svg viewBox="0 0 512 512"><rect width="512" height="512" rx="60" fill="#fbbf24"/><path d="M200 150h112v200H200z" fill="#1e40af"/><path d="M200 150h112v30H200z" fill="#1e3a8a"/><circle cx="230" cy="180" r="5" fill="#f5f5f4"/><circle cx="282" cy="180" r="5" fill="#f5f5f4"/></svg>`
|
||
};
|
||
|
||
// UTIL: Encode SVG string to Data URI
|
||
window.svgToDataUri = function(svg) {
|
||
const encoded = encodeURIComponent(svg);
|
||
return `data:image/svg+xml;charset=utf-8,${encoded}`;
|
||
}
|
||
|
||
// GENERATOR: Create simple, unique SVG for common terms
|
||
window.generateWordSvg = function(term) {
|
||
const t = String(term || 'default').toLowerCase();
|
||
const bg = {
|
||
jungle: '#14532d', crystal: '#1e3a8a', space: '#1f2937'
|
||
};
|
||
const base = (color) => `\n <svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">\n <defs>\n <linearGradient id="grad" x1="0%" y1="0%" x2="100%" y2="100%">\n <stop offset="0%" style="stop-color:${color};stop-opacity:1" />\n <stop offset="100%" style="stop-color:#0b1020;stop-opacity:1" />\n </linearGradient>\n </defs>\n <rect width="512" height="512" rx="40" fill="url(#grad)"/>`;
|
||
const end = "\n </svg>";
|
||
|
||
// Animals
|
||
if(['fish'].includes(t)) {
|
||
const svg = base('#0ea5e9') + `\n <ellipse cx="260" cy="260" rx="120" ry="70" fill="#38bdf8" stroke="#0ea5e9" stroke-width="10"/>\n <polygon points="340,260 420,220 420,300" fill="#0284c7"/>\n <polygon points="220,260 180,230 200,260 180,290" fill="#0369a1"/>\n <circle cx="300" cy="240" r="12" fill="#083344"/>` + end;
|
||
return svg;
|
||
}
|
||
if(['pig'].includes(t)) {
|
||
const svg = base('#f472b6') + `\n <circle cx="256" cy="256" r="140" fill="#fb7185"/>\n <ellipse cx="256" cy="300" rx="60" ry="40" fill="#fca5a5" stroke="#fb7185" stroke-width="8"/>\n <circle cx="236" cy="300" r="10" fill="#7f1d1d"/>\n <circle cx="276" cy="300" r="10" fill="#7f1d1d"/>\n <circle cx="220" cy="220" r="12" fill="#1f2937"/>\n <circle cx="292" cy="220" r="12" fill="#1f2937"/>` + end;
|
||
return svg;
|
||
}
|
||
if(['tiger'].includes(t)) {
|
||
const svg = base('#f59e0b') + `\n <circle cx="256" cy="256" r="150" fill="#f59e0b" stroke="#c2410c" stroke-width="12"/>\n <path d="M156 180h200 M180 240h160 M200 300h120" stroke="#7c2d12" stroke-width="18" stroke-linecap="round"/>` + end;
|
||
return svg;
|
||
}
|
||
if(['lion'].includes(t)) {
|
||
const svg = base('#d97706') + `\n <circle cx="256" cy="256" r="100" fill="#f59e0b"/>\n <circle cx="256" cy="256" r="160" fill="none" stroke="#92400e" stroke-width="40"/>\n <circle cx="230" cy="240" r="10" fill="#1f2937"/>\n <circle cx="282" cy="240" r="10" fill="#1f2937"/>\n <path d="M220 290q36 30 72 0" stroke="#1f2937" stroke-width="10" fill="none"/>` + end;
|
||
return svg;
|
||
}
|
||
if(['bird'].includes(t)) {
|
||
const svg = base('#0891b2') + `\n <ellipse cx="260" cy="280" rx="120" ry="70" fill="#22d3ee"/>\n <circle cx="320" cy="240" r="20" fill="#22d3ee"/>\n <polygon points="200,280 160,260 160,300" fill="#0ea5e9"/>\n <circle cx="332" cy="240" r="6" fill="#0f172a"/>` + end;
|
||
return svg;
|
||
}
|
||
if(['cow'].includes(t)) {
|
||
const svg = base('#a3e635') + `\n <rect x="156" y="180" width="220" height="160" rx="30" fill="#ecfeff" stroke="#6b7280" stroke-width="8"/>\n <circle cx="220" cy="240" r="20" fill="#6b7280"/>\n <circle cx="320" cy="260" r="18" fill="#6b7280"/>\n <circle cx="256" cy="320" r="28" fill="#fde68a"/>` + end;
|
||
return svg;
|
||
}
|
||
// Grammar words
|
||
if(['for'].includes(t)) {
|
||
const svg = base('#9333ea') + `\n <rect x="80" y="300" width="360" height="20" rx="10" fill="#a78bfa"/>\n <rect x="80" y="220" width="120" height="20" rx="10" fill="#c4b5fd"/>\n <rect x="220" y="220" width="120" height="20" rx="10" fill="#c4b5fd"/>\n <rect x="360" y="220" width="80" height="20" rx="10" fill="#c4b5fd"/>\n <text x="50%" y="180" text-anchor="middle" dominant-baseline="middle" font-family="Carter One" font-size="100" fill="#fff">FOR</text>` + end;
|
||
return svg;
|
||
}
|
||
if(['since'].includes(t)) {
|
||
const svg = base('#2563eb') + `\n <circle cx="120" cy="280" r="14" fill="#93c5fd"/>\n <rect x="120" y="280" width="280" height="14" rx="7" fill="#93c5fd"/>\n <polygon points="420,287 395,272 395,302" fill="#60a5fa"/>\n <text x="50%" y="200" text-anchor="middle" dominant-baseline="middle" font-family="Carter One" font-size="90" fill="#fff">SINCE</text>` + end;
|
||
return svg;
|
||
}
|
||
if(['during'].includes(t)) {
|
||
const svg = base('#14b8a6') + `\n <rect x="120" y="200" width="272" height="180" rx="20" fill="#99f6e4" stroke="#14b8a6" stroke-width="8"/>\n <rect x="150" y="240" width="60" height="20" rx="10" fill="#115e59"/>\n <rect x="230" y="240" width="60" height="20" rx="10" fill="#115e59"/>\n <rect x="310" y="240" width="60" height="20" rx="10" fill="#115e59"/>\n <text x="50%" y="340" text-anchor="middle" dominant-baseline="middle" font-family="Carter One" font-size="80" fill="#064e3b">DURING</text>` + end;
|
||
return svg;
|
||
}
|
||
if(['while'].includes(t)) {
|
||
const svg = base('#ef4444') + `\n <rect x="120" y="220" width="120" height="80" rx="12" fill="#fecaca"/>\n <rect x="272" y="220" width="120" height="80" rx="12" fill="#fecaca"/>\n <path d="M180 260h152" stroke="#ef4444" stroke-width="10" stroke-linecap="round"/>\n <text x="50%" y="340" text-anchor="middle" dominant-baseline="middle" font-family="Carter One" font-size="80" fill="#fff">WHILE</text>` + end;
|
||
return svg;
|
||
}
|
||
// Default emblem with initial letter and hashed color
|
||
const hash = Array.from(t).reduce((h,c)=> (h*31 + c.charCodeAt(0))>>>0, 7);
|
||
const hue = hash % 360;
|
||
const color = `hsl(${hue}, 75%, 55%)`;
|
||
const svg = base(color) + `\n <text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="Carter One, Arial" font-weight="900" font-size="180" fill="white" stroke="#000" stroke-width="8">${String(term).slice(0,1).toUpperCase()}</text>\n <text x="50%" y="85%" dominant-baseline="middle" text-anchor="middle" font-family="Fredoka, Arial" font-weight="700" font-size="48" fill="rgba(255,255,255,0.9)">${term}</text>` + end;
|
||
return svg;
|
||
}
|
||
|
||
// API: Unified getter for any term
|
||
window.getSvgDataUri = function(key) {
|
||
const term = String(key || 'default');
|
||
const svg = (window.SVG_ASSETS && window.SVG_ASSETS[term]) ? window.SVG_ASSETS[term] : window.generateWordSvg(term);
|
||
return window.svgToDataUri(svg);
|
||
}
|
||
// HELPER: Convert SVG string to Data URI
|
||
window.getSvgDataUri = function(key) {
|
||
const svg = window.SVG_ASSETS[key] || window.SVG_ASSETS["default"];
|
||
const encoded = encodeURIComponent(svg);
|
||
return `data:image/svg+xml;charset=utf-8,${encoded}`;
|
||
};
|
||
|
||
// LEVEL ICON GENERATOR (Dynamic)
|
||
window.getLevelSvg = function(level) {
|
||
let themeColor = "#48bb78"; // Jungle Green
|
||
let icon = "";
|
||
|
||
if (level <= 10) {
|
||
// Jungle Theme
|
||
themeColor = "#48bb78";
|
||
icon = `<path d="M256 150l-80 120h160z" fill="#2f855a"/><rect x="246" y="270" width="20" height="40" fill="#744210"/>`;
|
||
} else if (level <= 20) {
|
||
// Crystal Cave Theme
|
||
themeColor = "#805ad5";
|
||
icon = `<path d="M256 150l-60 100 60 100 60-100z" fill="#b794f4" opacity="0.8"/><path d="M256 150l-30 100 30 100" fill="white" opacity="0.3"/>`;
|
||
} else {
|
||
// Space Theme
|
||
themeColor = "#2c5282";
|
||
icon = `<circle cx="256" cy="256" r="80" fill="#63b3ed"/><circle cx="256" cy="256" r="110" stroke="#4299e1" stroke-width="10" fill="none" transform="rotate(45, 256, 256) scale(1, 0.3)"/>`;
|
||
}
|
||
|
||
const svg = `
|
||
<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
|
||
<defs>
|
||
<linearGradient id="grad${level}" x1="0%" y1="0%" x2="100%" y2="100%">
|
||
<stop offset="0%" style="stop-color:${themeColor};stop-opacity:1" />
|
||
<stop offset="100%" style="stop-color:#1a202c;stop-opacity:1" />
|
||
</linearGradient>
|
||
</defs>
|
||
<rect width="512" height="512" rx="40" fill="url(#grad${level})"/>
|
||
<!-- Decorative Border -->
|
||
<rect x="20" y="20" width="472" height="472" rx="30" stroke="white" stroke-width="10" stroke-opacity="0.3" fill="none"/>
|
||
|
||
<!-- Theme Icon Background -->
|
||
<g transform="translate(0, -20) scale(1.2) transform-origin(center)">
|
||
${icon}
|
||
</g>
|
||
|
||
<!-- Level Number -->
|
||
<text x="50%" y="85%" dominant-baseline="middle" text-anchor="middle" font-family="Arial, sans-serif" font-weight="900" font-size="120" fill="white" stroke="black" stroke-width="5">${level}</text>
|
||
</svg>`;
|
||
|
||
const encoded = encodeURIComponent(svg);
|
||
return `data:image/svg+xml;charset=utf-8,${encoded}`;
|
||
};
|
||
|
||
// MASCOT GENERATOR
|
||
window.getMascotSvg = function(mood) {
|
||
let eyes = "";
|
||
let mouth = "";
|
||
|
||
if(mood === 'happy') {
|
||
eyes = `<circle cx="180" cy="200" r="20" fill="white"/><circle cx="332" cy="200" r="20" fill="white"/>`;
|
||
mouth = `<path d="M180 300q76 60 152 0" stroke="white" stroke-width="20" fill="none" stroke-linecap="round"/>`;
|
||
} else if (mood === 'sad') {
|
||
eyes = `<circle cx="180" cy="220" r="20" fill="white"/><circle cx="332" cy="220" r="20" fill="white"/>`;
|
||
mouth = `<path d="M180 350q76 -60 152 0" stroke="white" stroke-width="20" fill="none" stroke-linecap="round"/>`;
|
||
} else { // excited
|
||
eyes = `<path d="M150 200l60-20 60 20" stroke="white" stroke-width="10" fill="none"/><path d="M302 200l60-20 60 20" stroke="white" stroke-width="10" fill="none"/>`;
|
||
mouth = `<ellipse cx="256" cy="320" rx="60" ry="40" fill="white"/>`;
|
||
}
|
||
|
||
const svg = `
|
||
<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
|
||
<defs>
|
||
<linearGradient id="tigerGrad" x1="0%" y1="0%" x2="100%" y2="100%">
|
||
<stop offset="0%" style="stop-color:#ed8936;stop-opacity:1" />
|
||
<stop offset="100%" style="stop-color:#c05621;stop-opacity:1" />
|
||
</linearGradient>
|
||
</defs>
|
||
<circle cx="256" cy="256" r="200" fill="url(#tigerGrad)"/>
|
||
<!-- Stripes -->
|
||
<path d="M256 56v60M100 256h60M412 256h-60" stroke="#744210" stroke-width="30" stroke-linecap="round"/>
|
||
<!-- Ears -->
|
||
<circle cx="100" cy="100" r="50" fill="#ed8936"/>
|
||
<circle cx="412" cy="100" r="50" fill="#ed8936"/>
|
||
<!-- Face -->
|
||
${eyes}
|
||
${mouth}
|
||
</svg>`;
|
||
|
||
const encoded = encodeURIComponent(svg);
|
||
return `data:image/svg+xml;charset=utf-8,${encoded}`;
|
||
};
|
||
|
||
// JUNGLE BACKGROUND GENERATOR
|
||
window.getBackgroundSvg = function() {
|
||
const svg = `
|
||
<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
|
||
<defs>
|
||
<linearGradient id="bgGrad" x1="0%" y1="0%" x2="0%" y2="100%">
|
||
<stop offset="0%" style="stop-color:#1a365d;stop-opacity:1" />
|
||
<stop offset="100%" style="stop-color:#064e3b;stop-opacity:1" />
|
||
</linearGradient>
|
||
<pattern id="leaves" x="0" y="0" width="200" height="200" patternUnits="userSpaceOnUse">
|
||
<ellipse cx="50" cy="50" rx="30" ry="15" fill="#48bb78" opacity="0.3" transform="rotate(45, 50, 50)"/>
|
||
<ellipse cx="150" cy="150" rx="25" ry="12" fill="#38a169" opacity="0.2" transform="rotate(-30, 150, 150)"/>
|
||
<ellipse cx="100" cy="180" rx="20" ry="10" fill="#68d391" opacity="0.3" transform="rotate(60, 100, 180)"/>
|
||
</pattern>
|
||
</defs>
|
||
<rect width="100%" height="100%" fill="url(#bgGrad)"/>
|
||
<rect width="100%" height="100%" fill="url(#leaves)"/>
|
||
</svg>`;
|
||
const encoded = encodeURIComponent(svg);
|
||
return `data:image/svg+xml;charset=utf-8,${encoded}`;
|
||
};
|