Skip to content

Instantly share code, notes, and snippets.

@AndrewAltimit
Last active March 11, 2026 18:43
Show Gist options
  • Select an option

  • Save AndrewAltimit/0de682097eb93e52e334b9e19f296822 to your computer and use it in GitHub Desktop.

Select an option

Save AndrewAltimit/0de682097eb93e52e334b9e19f296822 to your computer and use it in GitHub Desktop.
UI Concept SVGs
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 960 540" width="100%" height="100%">
<defs>
<style>
<![CDATA[
@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap');
/* Base Fonts */
text {
font-family: 'Share Tech Mono', 'Courier New', monospace;
font-weight: bold;
text-anchor: middle;
user-select: none;
}
.system-text {
font-size: 12px;
letter-spacing: 2px;
}
/* Color Transitions for Hover */
.menu-bg {
fill: transparent;
transition: fill 0.15s ease-in-out;
}
.trigger-bg {
fill: #0A0A0A;
transition: fill 0.15s ease-in-out;
}
.menu-text {
fill: #FFFFFF;
transition: fill 0.15s ease-in-out;
}
.fill-white {
fill: #FFFFFF;
transition: fill 0.15s ease-in-out;
}
.stroke-white {
stroke: #FFFFFF;
fill: none;
transition: stroke 0.15s ease-in-out;
}
/* Hover States */
.menu-item:hover {
cursor: pointer;
}
.menu-item:hover .menu-bg, .menu-item:hover .trigger-bg {
fill: #FF6A00;
}
.menu-item:hover .menu-text {
fill: #000000;
}
.menu-item:hover .fill-white {
fill: #000000;
}
.menu-item:hover .stroke-white {
stroke: #000000;
}
.desktop-icon:hover {
transform: translateY(-3px);
transition: transform 0.2s ease;
}
.desktop-icon {
transition: transform 0.2s ease;
}
.tab-text {
transition: all 0.2s;
cursor: pointer;
}
.tab-text:hover {
fill: #FF6A00;
}
.active-tab {
fill: #FFBA08;
filter: url(#glowOrange);
}
/* Animations */
@keyframes float-dot {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-6px); }
}
.world-dot {
animation: float-dot 3s ease-in-out infinite;
}
@keyframes pulse-frame {
0%, 100% { stroke-width: 2; }
50% { stroke-width: 4; }
}
.world-frame {
animation: pulse-frame 2s ease-in-out infinite;
}
@keyframes flap-pulse {
0%, 100% { transform: translateY(0) scaleY(1); }
50% { transform: translateY(3px) scaleY(0.85); }
}
.mailer-flap {
animation: flap-pulse 2s ease-in-out infinite;
transform-origin: 25px 15px;
}
@keyframes glitch {
0%, 18%, 22%, 100% { transform: translate(0, 0) skew(0deg); opacity: 1; }
19% { transform: translate(-3px, 1px) skew(-10deg); opacity: 0.8; }
20% { transform: translate(3px, -2px) skew(10deg); opacity: 0.9; }
21% { transform: translate(-1px, 2px) skew(0deg); opacity: 1; }
}
.news-n {
animation: glitch 4s infinite;
}
@keyframes load-bar {
0%, 100% { transform: scaleY(1); }
50% { transform: scaleY(0.3); }
}
.acc-bar {
transform-origin: center bottom;
animation: load-bar 1.5s infinite alternate ease-in-out;
}
@keyframes audio-bounce {
0%, 100% { transform: translateX(0); }
50% { transform: translateX(6px); }
}
.audio-inner {
animation: audio-bounce 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) infinite;
}
@keyframes data-blink {
0%, 100% { opacity: 1; }
50% { opacity: 0.15; }
}
.data-sq-1 { animation: data-blink 2.4s infinite; }
.data-sq-2 { animation: data-blink 2.4s infinite 0.8s; }
.data-sq-3 { animation: data-blink 2.4s infinite 1.6s; }
@keyframes spin {
100% { transform: rotate(360deg); }
}
.radar-spin {
animation: spin 25s linear infinite;
transform-origin: center;
}
@keyframes spin-reverse {
100% { transform: rotate(-360deg); }
}
.radar-spin-reverse {
animation: spin-reverse 35s linear infinite;
transform-origin: center;
}
]]>
</style>
<!-- Gradients & Patterns -->
<linearGradient id="bg-grad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#E85D04" />
<stop offset="50%" stop-color="#F48C06" />
<stop offset="100%" stop-color="#FAA307" />
</linearGradient>
<pattern id="grid" width="40" height="40" patternUnits="userSpaceOnUse">
<path d="M 40 0 L 0 0 0 40" fill="none" stroke="#FFFFFF" stroke-opacity="0.07" stroke-width="1"/>
</pattern>
<pattern id="mini-grid" width="4" height="4" patternUnits="userSpaceOnUse">
<rect width="4" height="4" fill="#0A0A0A" />
<path d="M 4 0 L 0 0 0 4" fill="none" stroke="#FF5400" stroke-width="0.5" opacity="0.4"/>
</pattern>
<pattern id="scanlines" width="4" height="4" patternUnits="userSpaceOnUse">
<line x1="0" y1="0" x2="4" y2="0" stroke="#000000" stroke-width="1" opacity="0.15"/>
<line x1="0" y1="2" x2="4" y2="2" stroke="#FFFFFF" stroke-width="1" opacity="0.03"/>
</pattern>
<!-- Filters -->
<filter id="dropShadow" x="-20%" y="-20%" width="140%" height="140%">
<feDropShadow dx="2" dy="2" stdDeviation="2" flood-color="#000000" flood-opacity="0.6"/>
</filter>
<filter id="glowOrange" x="-20%" y="-20%" width="140%" height="140%">
<feDropShadow dx="0" dy="0" stdDeviation="3" flood-color="#FF6A00" flood-opacity="0.8"/>
</filter>
<!-- Reusable Altimit-styled Cube -->
<g id="altimit-cube">
<polygon points="12,0 24,6 12,12 0,6" fill="#FFBA08" stroke="#111" stroke-width="1"/>
<polygon points="0,6 12,12 12,24 0,18" fill="#DC2F02" stroke="#111" stroke-width="1"/>
<polygon points="12,12 24,6 24,18 12,24" fill="#E85D04" stroke="#111" stroke-width="1"/>
</g>
</defs>
<!-- ==================== MAIN BACKGROUND ==================== -->
<!-- Base Base -->
<rect x="0" y="0" width="960" height="540" fill="#000000"/>
<!-- Main Right Panel Grid & Gradient -->
<rect x="120" y="25" width="840" height="435" fill="url(#bg-grad)"/>
<!-- Abstract Geometric Shards (Y2K UI Aesthetics) -->
<polygon points="120,25 420,25 200,460 120,460" fill="#DC2F02" opacity="0.6"/>
<polygon points="300,460 550,25 800,150 960,460" fill="#F48C06" opacity="0.5"/>
<polygon points="500,25 960,25 960,250" fill="#FFBA08" opacity="0.7"/>
<polygon points="450,460 700,100 960,100 960,460" fill="#FFFFFF" opacity="0.1"/>
<polygon points="120,300 350,150 600,460 120,460" fill="#000000" opacity="0.05"/>
<!-- Grid Overlay -->
<rect x="120" y="25" width="840" height="435" fill="url(#grid)"/>
<!-- Giant Faded Background Text -->
<text x="540" y="240" font-size="100" fill="#000000" opacity="0.08" letter-spacing="10">ALTIMIT</text>
<text x="540" y="330" font-size="60" fill="#000000" opacity="0.08" letter-spacing="20">P S I X</text>
<!-- Side Vertical Tech Text -->
<text x="-240" y="140" transform="rotate(-90)" font-size="10" fill="#FFFFFF" opacity="0.4" letter-spacing="4">SECURE KERNEL ACTIVATED // MEMORY BLOCK A</text>
<!-- Spinning Radar / Background Element -->
<g transform="translate(760, 242.5)" opacity="0.8">
<!-- Static outer elements -->
<circle cx="0" cy="0" r="120" fill="none" stroke="#111111" stroke-width="2" opacity="0.2"/>
<circle cx="0" cy="0" r="85" fill="none" stroke="#111111" stroke-width="2"/>
<circle cx="0" cy="0" r="65" fill="none" stroke="#111111" stroke-width="1" stroke-dasharray="6 4"/>
<circle cx="0" cy="0" r="35" fill="none" stroke="#111111" stroke-width="1"/>
<!-- Crosshairs -->
<line x1="-100" y1="0" x2="100" y2="0" stroke="#111111" stroke-width="1.5"/>
<line x1="0" y1="-100" x2="0" y2="100" stroke="#111111" stroke-width="1.5"/>
<line x1="-70" y1="-70" x2="70" y2="70" stroke="#111111" stroke-width="0.5"/>
<line x1="-70" y1="70" x2="70" y2="-70" stroke="#111111" stroke-width="0.5"/>
<!-- Rotating Elements -->
<g class="radar-spin">
<path d="M 0 -85 A 85 85 0 0 1 85 0" fill="none" stroke="#111111" stroke-width="4"/>
<path d="M 0 85 A 85 85 0 0 1 -85 0" fill="none" stroke="#111111" stroke-width="4"/>
<circle cx="0" cy="-65" r="4" fill="#111111"/>
<circle cx="0" cy="65" r="4" fill="#111111"/>
</g>
<g class="radar-spin-reverse">
<path d="M -35 0 A 35 35 0 0 0 0 35" fill="none" stroke="#111111" stroke-width="4"/>
<path d="M 35 0 A 35 35 0 0 0 0 -35" fill="none" stroke="#111111" stroke-width="4"/>
<line x1="0" y1="0" x2="50" y2="50" stroke="#111111" stroke-width="2"/>
<circle cx="50" cy="50" r="5" fill="#111111"/>
</g>
</g>
<!-- Floating Exploded Cube Cluster -->
<g transform="translate(800, 80) scale(1.2)" class="world-dot" filter="url(#dropShadow)">
<use href="#altimit-cube" x="0" y="12"/>
<use href="#altimit-cube" x="12" y="12"/>
<use href="#altimit-cube" x="6" y="0"/>
<!-- Connection lines projecting outwards -->
<path d="M 18 18 L 18 -10" stroke="#FFBA08" stroke-width="1.5" stroke-dasharray="2 2"/>
<path d="M 18 18 L -10 30" stroke="#FFBA08" stroke-width="1.5" stroke-dasharray="2 2"/>
<path d="M 18 18 L 46 30" stroke="#FFBA08" stroke-width="1.5" stroke-dasharray="2 2"/>
</g>
<!-- ==================== TOP SYSTEM BAR ==================== -->
<rect x="0" y="0" width="960" height="25" fill="#0A0A0A" />
<line x1="0" y1="25" x2="960" y2="25" stroke="#FF5400" stroke-width="2"/>
<!-- Battery & CPU (Left) -->
<g transform="translate(15, 6)">
<rect x="0" y="2" width="20" height="9" fill="none" stroke="#FFFFFF" stroke-width="1.2"/>
<rect x="20" y="4" width="2" height="5" fill="#FFFFFF"/>
<!-- Battery Fill Animated -->
<rect x="2" y="4" width="16" height="5" fill="#FF6A00" class="data-sq-1"/>
</g>
<text x="50" y="17" font-size="12" fill="#FFFFFF">100%</text>
<rect x="90" y="8" width="8" height="8" fill="none" stroke="#FFFFFF" stroke-width="1.5"/>
<text x="105" y="17" font-size="12" fill="#FFBA08" text-anchor="start">333 MHZ</text>
<!-- Top Navigation Tabs (Center-Left) -->
<g transform="translate(250, 6)">
<text x="0" y="11" class="tab-text active-tab" font-size="12">MS0</text>
<text x="50" y="11" class="tab-text" fill="#FFF" font-size="12">UMD</text>
<text x="100" y="11" class="tab-text" fill="#FFF" font-size="12">MOD</text>
<text x="150" y="11" class="tab-text" fill="#FFF" font-size="12">NET</text>
</g>
<!-- Title (Center) -->
<text x="540" y="17" font-size="14" fill="#FFFFFF" letter-spacing="2">ALTIMIT OS <tspan fill="#FFBA08">//</tspan> PSIX <tspan fill="#FFBA08">v1.1</tspan></text>
<!-- Time/Date (Right) -->
<g transform="translate(790, 6)">
<polygon points="8,1 15,4 15,11 8,14 1,11 1,4" fill="none" stroke="#FFFFFF" stroke-width="1.2"/>
<circle cx="8" cy="7.5" r="1.5" fill="#FFBA08"/>
<path d="M8,4 L8,7.5 L11,9.5" fill="none" stroke="#FFFFFF" stroke-width="1.2"/>
</g>
<text x="945" y="17" text-anchor="end" font-size="12" fill="#FFFFFF">11:20 NOV 23, 2024</text>
<!-- ==================== LEFT SIDEBAR MENU ==================== -->
<rect x="0" y="26" width="120" height="434" fill="#0A0A0A"/>
<line x1="120" y1="26" x2="120" y2="460" stroke="#FF5400" stroke-width="4"/>
<!-- 1. THE WORLD -->
<g class="menu-item" transform="translate(0, 26)">
<rect class="menu-bg" x="0" y="0" width="120" height="87"/>
<g transform="translate(35, 10)">
<path d="M 25 5 L 5 5 L 5 40 L 45 40 L 45 25" class="stroke-white world-frame" stroke-width="2" stroke-linejoin="miter"/>
<rect x="28" y="8" width="14" height="14" class="fill-white world-dot"/>
</g>
<text class="menu-text" x="60" y="72" font-size="14">THE WORLD</text>
</g>
<!-- 2. MAILER -->
<g class="menu-item" transform="translate(0, 113)">
<rect class="menu-bg" x="0" y="0" width="120" height="87"/>
<g transform="translate(35, 10)">
<polygon points="5,15 45,15 25,28" class="fill-white mailer-flap"/>
<path d="M 5 20 L 5 40 L 45 40 L 45 20 L 25 35 Z" class="stroke-white" stroke-width="2" stroke-linejoin="round"/>
</g>
<text class="menu-text" x="60" y="72" font-size="14">MAILER</text>
</g>
<!-- 3. NEWS -->
<g class="menu-item" transform="translate(0, 200)">
<rect class="menu-bg" x="0" y="0" width="120" height="87"/>
<g transform="translate(35, 10)">
<path d="M 5 40 V 5 H 18 L 32 25 V 5 H 45 V 40 H 32 L 18 20 V 40 Z" class="fill-white news-n"/>
</g>
<text class="menu-text" x="60" y="72" font-size="14">NEWS</text>
</g>
<!-- 4. MEDIA -->
<g class="menu-item" transform="translate(0, 287)">
<rect class="menu-bg" x="0" y="0" width="120" height="87"/>
<g transform="translate(35, 10)">
<polygon points="5,5 5,40 35,22.5" class="stroke-white" stroke-width="2" stroke-linejoin="round"/>
<polygon points="12,20 12,40 32,30" class="fill-white audio-inner"/>
</g>
<text class="menu-text" x="60" y="72" font-size="14">MEDIA</text>
</g>
<!-- 5. DATA -->
<g class="menu-item" transform="translate(0, 374)">
<rect class="menu-bg" x="0" y="0" width="120" height="86"/>
<g transform="translate(35, 10)">
<rect x="2" y="2" width="18" height="18" class="stroke-white data-sq-1" stroke-width="2"/>
<rect x="12" y="12" width="18" height="18" class="stroke-white data-sq-2" stroke-width="2"/>
<rect x="22" y="22" width="18" height="18" class="fill-white data-sq-3"/>
</g>
<text class="menu-text" x="60" y="72" font-size="14">DATA</text>
</g>
<!-- ==================== DESKTOP ICONS ==================== -->
<!-- 1. MY DEVICE -->
<g class="menu-item desktop-icon" transform="translate(180, 80)" filter="url(#dropShadow)">
<rect class="menu-bg" x="0" y="0" width="100" height="80" rx="8"/>
<g transform="translate(25, 15)">
<rect x="0" y="0" width="50" height="24" rx="12" class="stroke-white" stroke-width="2"/>
<rect x="12" y="4" width="26" height="16" class="fill-white"/>
<circle cx="6" cy="12" r="2" class="fill-white"/>
<circle cx="44" cy="12" r="2" class="fill-white"/>
</g>
<text class="menu-text" x="50" y="65" font-size="12">MY DEVICE</text>
</g>
<!-- 2. PSPACE -->
<g class="menu-item desktop-icon" transform="translate(320, 80)" filter="url(#dropShadow)">
<rect class="menu-bg" x="0" y="0" width="100" height="80" rx="8"/>
<g transform="translate(35, 10)">
<path d="M0,0 L18,0 L28,10 L28,35 L0,35 Z" class="stroke-white" stroke-width="2"/>
<path d="M18,0 L18,10 L28,10" class="stroke-white" stroke-width="2"/>
<rect x="5" y="15" width="6" height="6" class="fill-white data-sq-1"/>
<rect x="15" y="15" width="6" height="6" class="fill-white data-sq-2"/>
</g>
<text class="menu-text" x="50" y="65" font-size="12">PSPACE</text>
</g>
<!-- 3. JzBMSPlayer -->
<g class="menu-item desktop-icon" transform="translate(180, 200)" filter="url(#dropShadow)">
<rect class="menu-bg" x="0" y="0" width="100" height="80" rx="8"/>
<g transform="translate(30, 10)">
<circle cx="20" cy="18" r="16" class="stroke-white" stroke-width="2"/>
<circle cx="20" cy="18" r="4" class="fill-white audio-inner"/>
<path d="M20,18 L32,6 L40,6" class="stroke-white" stroke-width="2"/>
</g>
<text class="menu-text" x="50" y="65" font-size="12">JzBMSPlayer</text>
</g>
<!-- 4. TERMINAL -->
<g class="menu-item desktop-icon" transform="translate(320, 200)" filter="url(#dropShadow)">
<rect class="menu-bg" x="0" y="0" width="100" height="80" rx="8"/>
<g transform="translate(30, 15)">
<rect x="0" y="0" width="40" height="25" class="stroke-white" stroke-width="2"/>
<path d="M5,5 L12,12 L5,19" class="stroke-white" stroke-width="2"/>
<rect x="15" y="17" width="10" height="2" class="fill-white data-sq-3"/>
</g>
<text class="menu-text" x="50" y="65" font-size="12">TERMINAL</text>
</g>
<!-- 5. NETWORK -->
<g class="menu-item desktop-icon" transform="translate(180, 320)" filter="url(#dropShadow)">
<rect class="menu-bg" x="0" y="0" width="100" height="80" rx="8"/>
<g transform="translate(35, 15)">
<circle cx="15" cy="15" r="10" class="stroke-white" stroke-width="2"/>
<circle cx="15" cy="15" r="3" class="fill-white world-dot"/>
<path d="M0,15 L5,15 M25,15 L30,15 M15,0 L15,5 M15,25 L15,30" class="stroke-white" stroke-width="2"/>
</g>
<text class="menu-text" x="50" y="65" font-size="12">NETWORK</text>
</g>
<!-- ==================== BOTTOM HARDWARE / MEDIA BAR ==================== -->
<!-- Main Carbon Body -->
<path d="M 0 460 L 380 460 L 405 490 L 555 490 L 580 460 L 960 460 L 960 540 L 0 540 Z" fill="#111111" />
<!-- Glowing Orange Borders -->
<path d="M 0 460 L 380 460 L 405 490 L 555 490 L 580 460 L 960 460" fill="none" stroke="#FF5400" stroke-width="3"/>
<path d="M 0 464 L 378 464 L 403 494 L 557 494 L 582 464 L 960 464" fill="none" stroke="#FFFFFF" stroke-width="1" opacity="0.15"/>
<!-- Left L Button -->
<g class="menu-item" transform="translate(0, 460)">
<path class="trigger-bg" d="M 0 0 L 70 0 L 90 30 L 0 30 Z" stroke="#FF5400" stroke-width="2"/>
<text class="menu-text" x="35" y="20" font-family="'Arial Narrow', sans-serif" font-size="14" font-weight="bold">&lt; L</text>
</g>
<!-- Right R Button -->
<g class="menu-item" transform="translate(870, 460)">
<path class="trigger-bg" d="M 90 0 L 20 0 L 0 30 L 90 30 Z" stroke="#FF5400" stroke-width="2"/>
<text class="menu-text" x="55" y="20" font-family="'Arial Narrow', sans-serif" font-size="14" font-weight="bold">R &gt;</text>
</g>
<!-- Bottom Left Text Log -->
<text x="110" y="495" class="system-text" fill="#FFBA08" text-anchor="start">SYS://ROOT/CORE.BIN</text>
<text x="110" y="515" class="system-text" fill="#FFFFFF" text-anchor="start" opacity="0.5">CONNECTION ESTABLISHED</text>
<!-- Bottom Right Info Tabs -->
<g transform="translate(680, 480)">
<text x="0" y="0" class="system-text tab-text" fill="#FFF">AUDIO</text>
<line x1="30" y1="-10" x2="30" y2="2" stroke="#FF5400"/>
<text x="60" y="0" class="system-text tab-text" fill="#FFF">VIDEO</text>
<line x1="90" y1="-10" x2="90" y2="2" stroke="#FF5400"/>
<text x="120" y="0" class="system-text tab-text" fill="#FFF">IMAGE</text>
<line x1="150" y1="-10" x2="150" y2="2" stroke="#FF5400"/>
<text x="180" y="0" class="system-text tab-text" fill="#FFF">FILE</text>
</g>
<!-- Bottom Right USB Status Bar -->
<g transform="translate(620, 505)">
<!-- USB Box -->
<rect x="0" y="0" width="40" height="24" fill="#0A0A0A" rx="2" stroke="#FF5400"/>
<polygon points="20,4 24,9 16,9" fill="#FFBA08" class="data-sq-1"/>
<text x="20" y="20" font-family="sans-serif" font-size="10" font-weight="bold" fill="#FFFFFF">USB</text>
<!-- Animated Loading Bar -->
<rect x="50" y="8" width="100" height="8" fill="none" stroke="#FF5400" stroke-width="1"/>
<rect x="52" y="10" width="22" height="4" fill="#FFBA08" class="data-sq-1"/>
<rect x="76" y="10" width="22" height="4" fill="#FFBA08" class="data-sq-2"/>
<rect x="100" y="10" width="22" height="4" fill="#FFBA08" class="data-sq-3"/>
<rect x="124" y="10" width="24" height="4" fill="#FFBA08" opacity="0.2"/>
</g>
<!-- Central Media Screen & Controls -->
<g transform="translate(480, 500)" filter="url(#dropShadow)">
<!-- LCD Screen background -->
<rect x="-70" y="-30" width="140" height="30" rx="2" fill="url(#mini-grid)" stroke="#FF5400" stroke-width="1.5"/>
<rect x="-70" y="-30" width="140" height="30" rx="2" fill="#0A0A0A" opacity="0.6"/>
<!-- Animated EQ bars inside -->
<rect x="-60" y="-20" width="8" height="12" fill="#FFBA08" class="acc-bar"/>
<rect x="-48" y="-15" width="8" height="7" fill="#FFBA08" class="acc-bar" style="animation-delay:0.3s"/>
<rect x="-36" y="-25" width="8" height="17" fill="#FFBA08" class="acc-bar" style="animation-delay:0.1s"/>
<rect x="-24" y="-18" width="8" height="10" fill="#FFBA08" class="acc-bar" style="animation-delay:0.5s"/>
<text x="25" y="-10" class="system-text" fill="#FFF" font-size="12">TRACK 01</text>
</g>
<!-- Playback controls -->
<g transform="translate(480, 515)" class="menu-item">
<!-- Transparent Hitbox -->
<rect x="-50" y="-10" width="100" height="20" class="menu-bg"/>
<!-- Prev -->
<polygon class="fill-white" points="-30,0 -40,-5 -40,5"/>
<rect x="-44" y="-5" width="3" height="10" class="fill-white"/>
<!-- Play -->
<polygon class="fill-white" points="-8,-6 4,0 -8,6" />
<!-- Next -->
<polygon class="fill-white" points="30,0 20,-5 20,5"/>
<rect x="31" y="-5" width="3" height="10" class="fill-white"/>
</g>
<!-- ==================== OVERLAYS ==================== -->
<!-- Mouse Cursor Overlay -->
<g transform="translate(410, 260)" filter="url(#glowOrange)">
<path d="M 0 0 L 15 15 L 8 15 L 12 24 L 8 26 L 4 17 L -2 22 Z" fill="#FFBA08" stroke="#111111" stroke-width="1.5" stroke-linejoin="round"/>
</g>
<!-- Full Screen Scanline Overlay -->
<rect x="0" y="0" width="960" height="540" fill="url(#scanlines)" pointer-events="none"/>
</svg>
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment