123 lines
4.3 KiB
XML
123 lines
4.3 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 320" width="100%" height="100%">
|
|
<defs>
|
|
<!-- Chrome Horizontal Gradient -->
|
|
<linearGradient id="chromeText" x1="0%" y1="0%" x2="0%" y2="100%">
|
|
<stop offset="0%" stop-color="#ffffff"/>
|
|
<stop offset="35%" stop-color="#f5d0fe"/>
|
|
<stop offset="48%" stop-color="#c084fc"/>
|
|
<stop offset="52%" stop-color="#7e22ce"/>
|
|
<stop offset="80%" stop-color="#a855f7"/>
|
|
<stop offset="100%" stop-color="#ffffff"/>
|
|
</linearGradient>
|
|
|
|
<!-- Zone Accent Gradient -->
|
|
<linearGradient id="zoneText" x1="0%" y1="0%" x2="0%" y2="100%">
|
|
<stop offset="0%" stop-color="#ffffff"/>
|
|
<stop offset="35%" stop-color="#fbcfe8"/>
|
|
<stop offset="48%" stop-color="#f472b6"/>
|
|
<stop offset="52%" stop-color="#be185d"/>
|
|
<stop offset="80%" stop-color="#ec4899"/>
|
|
<stop offset="100%" stop-color="#ffffff"/>
|
|
</linearGradient>
|
|
|
|
<!-- Neon Glow Filter -->
|
|
<filter id="wordGlow" x="-20%" y="-20%" width="140%" height="140%">
|
|
<feGaussianBlur stdDeviation="8" result="blur1"/>
|
|
<feGaussianBlur stdDeviation="18" result="blur2"/>
|
|
<feMerge>
|
|
<feMergeNode in="blur2"/>
|
|
<feMergeNode in="blur1"/>
|
|
<feMergeNode in="SourceGraphic"/>
|
|
</feMerge>
|
|
</filter>
|
|
</defs>
|
|
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@1,900&family=Outfit:wght@800;900&display=swap');
|
|
.drip-font {
|
|
font-family: 'Outfit', 'Montserrat', -apple-system, sans-serif;
|
|
font-weight: 900;
|
|
font-style: italic;
|
|
text-transform: uppercase;
|
|
}
|
|
.tagline-font {
|
|
font-family: 'Montserrat', sans-serif;
|
|
font-weight: 800;
|
|
letter-spacing: 0.28em;
|
|
text-transform: uppercase;
|
|
}
|
|
</style>
|
|
|
|
<!-- Ambient Glow Behind Letters -->
|
|
<ellipse cx="450" cy="140" rx="420" ry="80" fill="#9333ea" opacity="0.25" filter="url(#wordGlow)"/>
|
|
|
|
<!-- Main Wordmark: DRIP ZONE -->
|
|
<g filter="url(#wordGlow)">
|
|
<!-- DRIP -->
|
|
<text x="50" y="175"
|
|
class="drip-font"
|
|
font-size="145"
|
|
letter-spacing="2"
|
|
fill="url(#chromeText)"
|
|
stroke="#9333ea"
|
|
stroke-width="7"
|
|
stroke-linejoin="round">DRIP</text>
|
|
|
|
<!-- ZONE -->
|
|
<text x="430" y="175"
|
|
class="drip-font"
|
|
font-size="145"
|
|
letter-spacing="2"
|
|
fill="url(#zoneText)"
|
|
stroke="#ec4899"
|
|
stroke-width="7"
|
|
stroke-linejoin="round">ZONE</text>
|
|
</g>
|
|
|
|
<!-- Droplets Drip Accents under typography -->
|
|
<g fill="#ec4899" filter="url(#wordGlow)" transform="translate(0, 10)">
|
|
<!-- Drop under D -->
|
|
<path d="M 105 175 C 105 195 98 210 98 220 C 98 225 104 227 107 222 C 112 210 115 195 115 175 Z"/>
|
|
<circle cx="102" cy="223" r="4.5" fill="#f0abfc"/>
|
|
|
|
<!-- Drop under R -->
|
|
<path d="M 230 175 C 230 205 220 230 220 245 C 220 252 227 254 230 246 C 238 230 242 205 242 175 Z"/>
|
|
<circle cx="225" cy="248" r="5" fill="#f0abfc"/>
|
|
|
|
<!-- Drop under P -->
|
|
<path d="M 360 175 C 360 195 352 215 352 225 C 352 230 358 230 361 224 C 367 210 370 195 370 175 Z"/>
|
|
<circle cx="356" cy="227" r="4.5" fill="#f0abfc"/>
|
|
|
|
<!-- Drop under Z -->
|
|
<path d="M 485 175 C 485 200 478 225 478 240 C 478 247 485 248 488 242 C 494 225 498 200 498 175 Z"/>
|
|
<circle cx="482" cy="243" r="5" fill="#f0abfc"/>
|
|
|
|
<!-- Drop under N -->
|
|
<path d="M 685 175 C 685 210 675 245 675 260 C 675 268 683 270 686 260 C 695 240 700 210 700 175 Z"/>
|
|
<circle cx="680" cy="263" r="5.5" fill="#f0abfc"/>
|
|
|
|
<!-- Drop under E -->
|
|
<path d="M 810 175 C 810 195 802 215 802 225 C 802 230 808 230 811 224 C 817 210 820 195 820 175 Z"/>
|
|
<circle cx="806" cy="227" r="4.5" fill="#f0abfc"/>
|
|
</g>
|
|
|
|
<!-- Tagline Banner in Spanish -->
|
|
<g transform="translate(450, 275)">
|
|
<!-- Subtitle Glow -->
|
|
<text x="0" y="0"
|
|
text-anchor="middle"
|
|
class="tagline-font"
|
|
font-size="21"
|
|
fill="#f0abfc"
|
|
opacity="0.8"
|
|
filter="url(#wordGlow)">ROPA URBANA Y ZAPATILLAS DEPORTIVAS</text>
|
|
|
|
<!-- Subtitle Crisp White Text -->
|
|
<text x="0" y="0"
|
|
text-anchor="middle"
|
|
class="tagline-font"
|
|
font-size="21"
|
|
fill="#ffffff">ROPA URBANA Y ZAPATILLAS DEPORTIVAS</text>
|
|
</g>
|
|
</svg>
|