Current section
Files
Jump to
Current section
Files
assets/logo/logo_light.svg
<svg
xmlns="http://www.w3.org/2000/svg"
width="512"
height="512"
viewBox="0 0 512 512"
>
<defs>
<linearGradient id="bgGrad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:#E8F5E9;stop-opacity:1" />
<stop offset="100%" style="stop-color:#C8E6C9;stop-opacity:1" />
</linearGradient>
<linearGradient id="robeGrad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:#6E2FA0;stop-opacity:0.7" />
<stop offset="100%" style="stop-color:#4A1F7A;stop-opacity:0.7" />
</linearGradient>
<filter id="glow">
<feGaussianBlur stdDeviation="3" result="coloredBlur" />
<feMerge>
<feMergeNode in="coloredBlur" />
<feMergeNode in="SourceGraphic" />
</feMerge>
</filter>
</defs>
<!-- Light misty background -->
<rect width="512" height="512" rx="80" fill="url(#bgGrad)" />
<!-- Alchemist staff -->
<rect
x="145"
y="180"
width="8"
height="250"
rx="4"
fill="#8B4513"
opacity="0.7"
/>
<circle cx="149" cy="170" r="15" fill="#FFD700" filter="url(#glow)" />
<circle cx="149" cy="170" r="8" fill="#6E2FA0" opacity="0.6" />
<!-- Alchemist robe -->
<ellipse
cx="256"
cy="380"
rx="90"
ry="100"
fill="url(#robeGrad)"
opacity="0.6"
/>
<path
d="M166 280 Q166 350 176 450 L336 450 Q346 350 346 280 Z"
fill="url(#robeGrad)"
opacity="0.5"
/>
<!-- Alchemist head -->
<circle cx="256" cy="220" r="65" fill="#FFD7B5" opacity="0.9" />
<!-- White beard -->
<path
d="M191 240 Q256 320 321 240 Q321 280 256 300 Q191 280 191 240 Z"
fill="#ffffff"
opacity="0.95"
/>
<path
d="M210 260 Q256 310 302 260 Q302 280 256 290 Q210 280 210 260 Z"
fill="#F5F5F5"
opacity="0.9"
/>
<!-- Facial features -->
<circle cx="235" cy="215" r="5" fill="#333" opacity="0.8" />
<circle cx="277" cy="215" r="5" fill="#333" opacity="0.8" />
<path
d="M240 235 Q256 245 272 235"
stroke="#333"
stroke-width="3"
fill="none"
opacity="0.6"
/>
<!-- Alchemist hat -->
<path d="M256 100 L225 220 L287 220 Z" fill="#6E2FA0" opacity="0.85" />
<ellipse cx="256" cy="220" rx="62" ry="18" fill="#6E2FA0" opacity="0.85" />
<circle cx="256" cy="150" r="5" fill="#FFD700" filter="url(#glow)" />
<circle cx="242" cy="170" r="4" fill="#FFD700" filter="url(#glow)" />
<circle cx="270" cy="165" r="4" fill="#FFD700" filter="url(#glow)" />
<!-- Hands holding phone -->
<ellipse cx="196" cy="340" rx="20" ry="15" fill="#FFD7B5" opacity="0.8" />
<ellipse cx="316" cy="340" rx="20" ry="15" fill="#FFD7B5" opacity="0.8" />
<!-- Mobile phone -->
<rect
x="206"
y="300"
width="100"
height="160"
rx="20"
fill="#ffffff"
stroke="#6E2FA0"
stroke-width="2"
opacity="0.95"
/>
<rect
x="214"
y="308"
width="84"
height="130"
rx="10"
fill="#E8F5E9"
opacity="0.6"
/>
<!-- Phone screen content -->
<text
x="256"
y="365"
font-family="monospace, Consolas, 'Courier New'"
font-size="24"
fill="#6E2FA0"
text-anchor="middle"
opacity="0.9"
>< ></text>
<text
x="256"
y="395"
font-family="monospace, Consolas, 'Courier New'"
font-size="18"
fill="#FF6B35"
text-anchor="middle"
>= _</text>
<!-- Signal bars -->
<rect
x="222"
y="315"
width="6"
height="15"
rx="2"
fill="#6E2FA0"
opacity="0.6"
/>
<rect
x="231"
y="312"
width="6"
height="18"
rx="2"
fill="#6E2FA0"
opacity="0.6"
/>
<rect
x="240"
y="309"
width="6"
height="21"
rx="2"
fill="#6E2FA0"
opacity="0.6"
/>
<!-- Home indicator -->
<rect
x="231"
y="455"
width="50"
height="4"
rx="2"
fill="#6E2FA0"
opacity="0.4"
/>
<!-- Text (dark for light bg) -->
<text
x="256"
y="485"
font-family="Arial, Helvetica, sans-serif"
font-size="48"
font-weight="bold"
fill="#2D5A27"
text-anchor="middle"
filter="url(#glow)"
>dala</text>
<text
x="256"
y="508"
font-family="Arial, Helvetica, sans-serif"
font-size="16"
fill="#1A3C1A"
text-anchor="middle"
>Elixir + Mobile + Dalat</text>
<text
x="256"
y="525"
font-family="Arial, Helvetica, sans-serif"
font-size="12"
fill="#1A3C1A"
text-anchor="middle"
opacity="0.7"
>Vietnam 🇻🇳</text>
<!-- Vietnamese flag accent -->
<path
d="M256 520 L259 528 L268 528 L261 533 L264 541 L256 536 L248 541 L251 533 L244 528 L253 528 Z"
fill="#FF6B35"
opacity="0.4"
/>
</svg>