AdminLTE3

This commit is contained in:
2025-10-26 22:14:47 +09:00
parent 291fc63a4c
commit 9974811a3e
226 changed files with 88284 additions and 3406 deletions

View File

@@ -0,0 +1,55 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" fill="none">
<!-- Background circle -->
<circle cx="100" cy="100" r="90" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.2)" stroke-width="2"/>
<!-- Logo design canvas -->
<rect x="60" y="50" width="80" height="80" rx="8" fill="rgba(255,255,255,0.9)" stroke="rgba(255,255,255,0.3)" stroke-width="2"/>
<!-- Logo elements - abstract brand symbol -->
<circle cx="100" cy="90" r="20" fill="none" stroke="rgba(59,130,246,0.6)" stroke-width="3"/>
<path d="M85 90 Q100 75 115 90 Q100 105 85 90" fill="rgba(139,92,246,0.5)"/>
<circle cx="100" cy="90" r="8" fill="rgba(245,158,11,0.7)"/>
<!-- Brand typography -->
<rect x="70" y="115" width="60" height="8" rx="4" fill="rgba(59,130,246,0.3)"/>
<!-- Color swatches -->
<rect x="20" y="30" width="15" height="15" rx="3" fill="rgba(59,130,246,0.8)"/>
<rect x="20" y="50" width="15" height="15" rx="3" fill="rgba(139,92,246,0.8)"/>
<rect x="20" y="70" width="15" height="15" rx="3" fill="rgba(245,158,11,0.8)"/>
<rect x="20" y="90" width="15" height="15" rx="3" fill="rgba(34,197,94,0.8)"/>
<rect x="20" y="110" width="15" height="15" rx="3" fill="rgba(239,68,68,0.8)"/>
<!-- Business cards -->
<rect x="150" y="40" width="30" height="20" rx="3" fill="rgba(255,255,255,0.8)" stroke="rgba(255,255,255,0.4)" stroke-width="1"/>
<rect x="152" y="45" width="8" height="3" rx="1.5" fill="rgba(59,130,246,0.5)"/>
<rect x="152" y="50" width="12" height="2" rx="1" fill="rgba(139,92,246,0.3)"/>
<rect x="152" y="54" width="10" height="2" rx="1" fill="rgba(245,158,11,0.3)"/>
<!-- Brand guidelines -->
<rect x="25" y="140" width="40" height="30" rx="4" fill="rgba(255,255,255,0.7)" stroke="rgba(255,255,255,0.3)" stroke-width="1"/>
<rect x="30" y="150" width="30" height="3" rx="1.5" fill="rgba(59,130,246,0.4)"/>
<rect x="30" y="157" width="20" height="2" rx="1" fill="rgba(139,92,246,0.3)"/>
<rect x="30" y="162" width="25" height="2" rx="1" fill="rgba(245,158,11,0.3)"/>
<!-- Letterhead -->
<rect x="140" y="140" width="35" height="45" rx="4" fill="rgba(255,255,255,0.8)" stroke="rgba(255,255,255,0.4)" stroke-width="1"/>
<circle cx="157" cy="155" r="6" fill="rgba(59,130,246,0.3)" stroke="rgba(59,130,246,0.5)" stroke-width="1"/>
<rect x="145" y="165" width="20" height="2" rx="1" fill="rgba(139,92,246,0.3)"/>
<rect x="145" y="170" width="15" height="2" rx="1" fill="rgba(245,158,11,0.3)"/>
<rect x="145" y="175" width="18" height="2" rx="1" fill="rgba(34,197,94,0.3)"/>
<!-- Pencil/Design tool -->
<rect x="160" y="15" width="4" height="25" rx="2" fill="rgba(245,158,11,0.7)"/>
<path d="M160 40 L164 40 L162 45 Z" fill="rgba(139,92,246,0.6)"/>
<circle cx="162" cy="12" r="3" fill="rgba(236,72,153,0.6)"/>
<!-- Typography samples -->
<text x="75" y="180" fill="rgba(255,255,255,0.5)" font-family="serif" font-size="12" font-weight="bold">Aa</text>
<text x="95" y="180" fill="rgba(255,255,255,0.4)" font-family="sans-serif" font-size="10">Brand</text>
<text x="125" y="180" fill="rgba(255,255,255,0.3)" font-family="monospace" font-size="8">123</text>
<!-- Copyright symbol -->
<circle cx="175" cy="100" r="8" fill="none" stroke="rgba(255,255,255,0.4)" stroke-width="2"/>
<text x="171" y="105" fill="rgba(255,255,255,0.4)" font-family="serif" font-size="10" font-weight="bold">©</text>
</svg>

After

Width:  |  Height:  |  Size: 3.3 KiB

View File

@@ -0,0 +1,69 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" fill="none">
<!-- Background circle -->
<circle cx="100" cy="100" r="90" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.2)" stroke-width="2"/>
<!-- Light bulb -->
<circle cx="100" cy="85" r="25" fill="rgba(245,158,11,0.2)" stroke="rgba(245,158,11,0.6)" stroke-width="3"/>
<rect x="95" y="105" width="10" height="8" rx="2" fill="rgba(255,255,255,0.7)"/>
<rect x="93" y="113" width="14" height="4" rx="2" fill="rgba(255,255,255,0.8)"/>
<!-- Light rays -->
<path d="M75 60 L80 65" stroke="rgba(245,158,11,0.6)" stroke-width="2"/>
<path d="M125 60 L120 65" stroke="rgba(245,158,11,0.6)" stroke-width="2"/>
<path d="M60 85 L65 85" stroke="rgba(245,158,11,0.6)" stroke-width="2"/>
<path d="M140 85 L135 85" stroke="rgba(245,158,11,0.6)" stroke-width="2"/>
<path d="M75 110 L80 105" stroke="rgba(245,158,11,0.6)" stroke-width="2"/>
<path d="M125 110 L120 105" stroke="rgba(245,158,11,0.6)" stroke-width="2"/>
<!-- Filament inside bulb -->
<path d="M90 75 Q100 70 110 75 Q100 80 90 75" stroke="rgba(245,158,11,0.8)" stroke-width="2" fill="none"/>
<path d="M90 85 Q100 90 110 85 Q100 95 90 85" stroke="rgba(245,158,11,0.8)" stroke-width="2" fill="none"/>
<!-- Gears -->
<circle cx="50" cy="140" r="12" fill="none" stroke="rgba(255,255,255,0.5)" stroke-width="2"/>
<circle cx="50" cy="140" r="8" fill="rgba(59,130,246,0.3)"/>
<rect x="46" y="132" width="8" height="3" rx="1.5" fill="rgba(255,255,255,0.6)"/>
<rect x="46" y="145" width="8" height="3" rx="1.5" fill="rgba(255,255,255,0.6)"/>
<rect x="42" y="138" width="3" height="8" rx="1.5" fill="rgba(255,255,255,0.6)"/>
<rect x="55" y="138" width="3" height="8" rx="1.5" fill="rgba(255,255,255,0.6)"/>
<circle cx="150" cy="50" r="10" fill="none" stroke="rgba(255,255,255,0.4)" stroke-width="2"/>
<circle cx="150" cy="50" r="6" fill="rgba(34,197,94,0.3)"/>
<rect x="147" y="43" width="6" height="2" rx="1" fill="rgba(255,255,255,0.5)"/>
<rect x="147" y="55" width="6" height="2" rx="1" fill="rgba(255,255,255,0.5)"/>
<rect x="144" y="48" width="2" height="6" rx="1" fill="rgba(255,255,255,0.5)"/>
<rect x="154" y="48" width="2" height="6" rx="1" fill="rgba(255,255,255,0.5)"/>
<!-- Charts/Analytics -->
<rect x="130" y="130" width="50" height="30" rx="4" fill="rgba(255,255,255,0.8)"/>
<rect x="135" y="145" width="6" height="12" fill="rgba(59,130,246,0.6)"/>
<rect x="143" y="140" width="6" height="17" fill="rgba(34,197,94,0.6)"/>
<rect x="151" y="148" width="6" height="9" fill="rgba(245,158,11,0.6)"/>
<rect x="159" y="142" width="6" height="15" fill="rgba(139,92,246,0.6)"/>
<rect x="167" y="146" width="6" height="11" fill="rgba(236,72,153,0.6)"/>
<!-- Puzzle pieces -->
<path d="M20 40 L35 40 Q40 35 45 40 L60 40 L60 55 Q55 60 60 65 L60 80 L45 80 Q40 75 35 80 L20 80 Z"
fill="rgba(255,255,255,0.6)" stroke="rgba(255,255,255,0.4)" stroke-width="1"/>
<circle cx="40" cy="60" r="3" fill="rgba(59,130,246,0.5)"/>
<!-- Arrow pointing up (growth) -->
<path d="M170 140 L170 120" stroke="rgba(34,197,94,0.8)" stroke-width="3"/>
<path d="M165 125 L170 120 L175 125" stroke="rgba(34,197,94,0.8)" stroke-width="3" fill="none"/>
<!-- Document/Report -->
<rect x="25" y="160" width="20" height="25" rx="2" fill="rgba(255,255,255,0.8)"/>
<rect x="28" y="165" width="14" height="2" rx="1" fill="rgba(59,130,246,0.4)"/>
<rect x="28" y="170" width="10" height="1.5" rx="0.75" fill="rgba(139,92,246,0.3)"/>
<rect x="28" y="174" width="12" height="1.5" rx="0.75" fill="rgba(245,158,11,0.3)"/>
<rect x="28" y="178" width="8" height="1.5" rx="0.75" fill="rgba(34,197,94,0.3)"/>
<!-- Clock/Time -->
<circle cx="170" cy="170" r="8" fill="rgba(255,255,255,0.7)" stroke="rgba(255,255,255,0.4)" stroke-width="1"/>
<path d="M170 165 L170 170 L175 170" stroke="rgba(59,130,246,0.8)" stroke-width="2" fill="none"/>
<!-- Target/Goals -->
<circle cx="30" cy="30" r="8" fill="none" stroke="rgba(239,68,68,0.5)" stroke-width="2"/>
<circle cx="30" cy="30" r="5" fill="none" stroke="rgba(239,68,68,0.6)" stroke-width="1"/>
<circle cx="30" cy="30" r="2" fill="rgba(239,68,68,0.7)"/>
</svg>

After

Width:  |  Height:  |  Size: 4.1 KiB

View File

@@ -0,0 +1,52 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" fill="none">
<!-- Background circle -->
<circle cx="100" cy="100" r="90" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.2)" stroke-width="2"/>
<!-- Main gear -->
<circle cx="100" cy="100" r="30" fill="none" stroke="rgba(255,255,255,0.6)" stroke-width="4"/>
<circle cx="100" cy="100" r="20" fill="rgba(59,130,246,0.3)"/>
<!-- Gear teeth -->
<rect x="95" y="65" width="10" height="8" rx="2" fill="rgba(255,255,255,0.7)"/>
<rect x="95" y="127" width="10" height="8" rx="2" fill="rgba(255,255,255,0.7)"/>
<rect x="65" y="95" width="8" height="10" rx="2" fill="rgba(255,255,255,0.7)"/>
<rect x="127" y="95" width="8" height="10" rx="2" fill="rgba(255,255,255,0.7)"/>
<!-- Diagonal gear teeth -->
<rect x="80" y="75" width="8" height="8" rx="2" fill="rgba(255,255,255,0.6)" transform="rotate(45 84 79)"/>
<rect x="112" y="75" width="8" height="8" rx="2" fill="rgba(255,255,255,0.6)" transform="rotate(-45 116 79)"/>
<rect x="80" y="117" width="8" height="8" rx="2" fill="rgba(255,255,255,0.6)" transform="rotate(-45 84 121)"/>
<rect x="112" y="117" width="8" height="8" rx="2" fill="rgba(255,255,255,0.6)" transform="rotate(45 116 121)"/>
<!-- Center circle -->
<circle cx="100" cy="100" r="8" fill="rgba(255,255,255,0.8)"/>
<!-- Smaller gears -->
<circle cx="60" cy="60" r="15" fill="none" stroke="rgba(255,255,255,0.4)" stroke-width="2"/>
<circle cx="60" cy="60" r="10" fill="rgba(34,197,94,0.3)"/>
<rect x="57" y="48" width="6" height="4" rx="1" fill="rgba(255,255,255,0.5)"/>
<rect x="57" y="68" width="6" height="4" rx="1" fill="rgba(255,255,255,0.5)"/>
<rect x="48" y="57" width="4" height="6" rx="1" fill="rgba(255,255,255,0.5)"/>
<rect x="68" y="57" width="4" height="6" rx="1" fill="rgba(255,255,255,0.5)"/>
<circle cx="140" cy="140" r="15" fill="none" stroke="rgba(255,255,255,0.4)" stroke-width="2"/>
<circle cx="140" cy="140" r="10" fill="rgba(245,158,11,0.3)"/>
<rect x="137" y="128" width="6" height="4" rx="1" fill="rgba(255,255,255,0.5)"/>
<rect x="137" y="148" width="6" height="4" rx="1" fill="rgba(255,255,255,0.5)"/>
<rect x="128" y="137" width="4" height="6" rx="1" fill="rgba(255,255,255,0.5)"/>
<rect x="148" y="137" width="4" height="6" rx="1" fill="rgba(255,255,255,0.5)"/>
<!-- Connecting lines -->
<path d="M70 70 L90 90" stroke="rgba(255,255,255,0.3)" stroke-width="2" stroke-dasharray="4,4"/>
<path d="M130 130 L110 110" stroke="rgba(255,255,255,0.3)" stroke-width="2" stroke-dasharray="4,4"/>
<!-- Decorative elements -->
<circle cx="30" cy="170" r="4" fill="rgba(255,255,255,0.2)"/>
<circle cx="170" cy="30" r="4" fill="rgba(255,255,255,0.2)"/>
<!-- Tool icons -->
<rect x="20" y="25" width="15" height="3" rx="1.5" fill="rgba(255,255,255,0.4)"/>
<circle cx="22" cy="26.5" r="1.5" fill="rgba(255,255,255,0.6)"/>
<path d="M165 165 L175 175 M170 160 L180 170" stroke="rgba(255,255,255,0.4)" stroke-width="2"/>
</svg>

After

Width:  |  Height:  |  Size: 2.9 KiB

View File

@@ -0,0 +1,56 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" fill="none">
<!-- Background circle -->
<circle cx="100" cy="100" r="90" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.2)" stroke-width="2"/>
<!-- Chart/Graph -->
<rect x="40" y="60" width="120" height="80" rx="8" fill="rgba(255,255,255,0.9)"/>
<!-- Chart bars -->
<rect x="55" y="100" width="12" height="30" fill="rgba(34,197,94,0.7)"/>
<rect x="72" y="85" width="12" height="45" fill="rgba(59,130,246,0.7)"/>
<rect x="89" y="95" width="12" height="35" fill="rgba(245,158,11,0.7)"/>
<rect x="106" y="75" width="12" height="55" fill="rgba(239,68,68,0.7)"/>
<rect x="123" y="90" width="12" height="40" fill="rgba(139,92,246,0.7)"/>
<!-- Trend line -->
<path d="M55 110 L72 95 L89 105 L106 85 L123 100" stroke="rgba(236,72,153,0.8)" stroke-width="3" fill="none"/>
<!-- Chart dots -->
<circle cx="61" cy="110" r="3" fill="rgba(236,72,153,0.8)"/>
<circle cx="78" cy="95" r="3" fill="rgba(236,72,153,0.8)"/>
<circle cx="95" cy="105" r="3" fill="rgba(236,72,153,0.8)"/>
<circle cx="112" cy="85" r="3" fill="rgba(236,72,153,0.8)"/>
<circle cx="129" cy="100" r="3" fill="rgba(236,72,153,0.8)"/>
<!-- Megaphone/Speaker -->
<path d="M20 120 L35 115 L35 125 Z" fill="rgba(255,255,255,0.8)"/>
<rect x="35" y="117" width="15" height="6" rx="3" fill="rgba(255,255,255,0.8)"/>
<path d="M50 115 Q60 115 60 120 Q60 125 50 125" stroke="rgba(255,255,255,0.6)" stroke-width="2" fill="none"/>
<!-- Social media icons -->
<circle cx="170" cy="40" r="8" fill="rgba(59,130,246,0.7)"/>
<text x="166" y="45" fill="white" font-family="sans-serif" font-size="8" font-weight="bold">f</text>
<circle cx="170" cy="60" r="8" fill="rgba(29,161,242,0.7)"/>
<text x="167" y="65" fill="white" font-family="sans-serif" font-size="8" font-weight="bold">t</text>
<circle cx="170" cy="80" r="8" fill="rgba(225,48,108,0.7)"/>
<text x="167" y="85" fill="white" font-family="sans-serif" font-size="8" font-weight="bold">i</text>
<!-- Target/Bullseye -->
<circle cx="30" cy="170" r="12" fill="none" stroke="rgba(255,255,255,0.5)" stroke-width="2"/>
<circle cx="30" cy="170" r="8" fill="none" stroke="rgba(255,255,255,0.5)" stroke-width="2"/>
<circle cx="30" cy="170" r="4" fill="rgba(239,68,68,0.7)"/>
<!-- SEO elements -->
<text x="140" y="170" fill="rgba(255,255,255,0.5)" font-family="sans-serif" font-size="12" font-weight="bold">SEO</text>
<!-- Growth arrow -->
<path d="M140 110 L155 95" stroke="rgba(34,197,94,0.8)" stroke-width="3" fill="none"/>
<path d="M150 95 L155 95 L155 100" stroke="rgba(34,197,94,0.8)" stroke-width="3" fill="none"/>
<!-- Analytics symbols -->
<circle cx="60" cy="40" r="3" fill="rgba(255,255,255,0.4)"/>
<circle cx="75" cy="35" r="4" fill="rgba(255,255,255,0.3)"/>
<circle cx="90" cy="45" r="2" fill="rgba(255,255,255,0.4)"/>
</svg>

After

Width:  |  Height:  |  Size: 2.8 KiB

View File

@@ -0,0 +1,43 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" fill="none">
<!-- Background circle -->
<circle cx="100" cy="100" r="90" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.2)" stroke-width="2"/>
<!-- Main phone -->
<rect x="70" y="40" width="60" height="120" rx="12" fill="rgba(255,255,255,0.95)" stroke="rgba(255,255,255,0.3)" stroke-width="2"/>
<!-- Screen -->
<rect x="75" y="55" width="50" height="90" rx="6" fill="rgba(34,197,94,0.2)"/>
<!-- Status bar -->
<rect x="78" y="58" width="44" height="8" fill="rgba(34,197,94,0.4)"/>
<!-- App icons grid -->
<rect x="80" y="75" width="12" height="12" rx="3" fill="rgba(59,130,246,0.7)"/>
<rect x="95" y="75" width="12" height="12" rx="3" fill="rgba(239,68,68,0.7)"/>
<rect x="110" y="75" width="12" height="12" rx="3" fill="rgba(245,158,11,0.7)"/>
<rect x="80" y="92" width="12" height="12" rx="3" fill="rgba(139,92,246,0.7)"/>
<rect x="95" y="92" width="12" height="12" rx="3" fill="rgba(16,185,129,0.7)"/>
<rect x="110" y="92" width="12" height="12" rx="3" fill="rgba(236,72,153,0.7)"/>
<!-- Navigation bar -->
<circle cx="100" cy="130" r="8" fill="rgba(255,255,255,0.8)" stroke="rgba(34,197,94,0.3)" stroke-width="2"/>
<!-- Home button -->
<circle cx="100" cy="150" r="4" fill="rgba(255,255,255,0.6)"/>
<!-- Secondary phones -->
<rect x="35" y="80" width="25" height="45" rx="6" fill="rgba(255,255,255,0.7)" stroke="rgba(255,255,255,0.2)" stroke-width="1"/>
<rect x="38" y="88" width="19" height="25" fill="rgba(34,197,94,0.3)"/>
<rect x="140" y="90" width="25" height="45" rx="6" fill="rgba(255,255,255,0.7)" stroke="rgba(255,255,255,0.2)" stroke-width="1"/>
<rect x="143" y="98" width="19" height="25" fill="rgba(34,197,94,0.3)"/>
<!-- Decorative elements -->
<circle cx="50" cy="50" r="4" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.2)" stroke-width="1"/>
<circle cx="150" cy="160" r="6" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.2)" stroke-width="1"/>
<!-- WiFi and signal indicators -->
<path d="M25 25 L35 25 M30 20 L30 30 M27 23 L33 23" stroke="rgba(255,255,255,0.3)" stroke-width="2" fill="none"/>
<path d="M165 25 Q175 25 175 35 Q175 45 165 45" stroke="rgba(255,255,255,0.3)" stroke-width="2" fill="none"/>
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@@ -0,0 +1,47 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" fill="none">
<!-- Background circle -->
<circle cx="100" cy="100" r="90" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.2)" stroke-width="2"/>
<!-- Design canvas/artboard -->
<rect x="50" y="50" width="100" height="80" rx="8" fill="rgba(255,255,255,0.9)" stroke="rgba(255,255,255,0.3)" stroke-width="2"/>
<!-- Design elements - wireframe -->
<rect x="60" y="65" width="80" height="8" rx="4" fill="rgba(139,92,246,0.3)"/>
<rect x="60" y="80" width="50" height="6" rx="3" fill="rgba(236,72,153,0.4)"/>
<rect x="60" y="92" width="70" height="6" rx="3" fill="rgba(59,130,246,0.4)"/>
<!-- Button mockups -->
<rect x="60" y="105" width="25" height="12" rx="6" fill="rgba(34,197,94,0.6)"/>
<rect x="90" y="105" width="25" height="12" rx="6" fill="rgba(239,68,68,0.3)" stroke="rgba(239,68,68,0.5)" stroke-width="1"/>
<!-- Color palette -->
<circle cx="170" cy="60" r="8" fill="rgba(59,130,246,0.8)"/>
<circle cx="170" cy="80" r="8" fill="rgba(34,197,94,0.8)"/>
<circle cx="170" cy="100" r="8" fill="rgba(245,158,11,0.8)"/>
<circle cx="170" cy="120" r="8" fill="rgba(236,72,153,0.8)"/>
<!-- Design tools -->
<rect x="20" y="30" width="40" height="6" rx="3" fill="rgba(255,255,255,0.7)"/>
<circle cx="25" cy="33" r="2" fill="rgba(59,130,246,0.7)"/>
<circle cx="32" cy="33" r="2" fill="rgba(34,197,94,0.7)"/>
<circle cx="39" cy="33" r="2" fill="rgba(239,68,68,0.7)"/>
<!-- Cursor/pointer -->
<path d="M25 160 L35 170 L30 175 L20 170 Z" fill="rgba(255,255,255,0.8)" stroke="rgba(255,255,255,0.4)" stroke-width="1"/>
<!-- Grid lines -->
<defs>
<pattern id="grid" width="10" height="10" patternUnits="userSpaceOnUse">
<path d="M 10 0 L 0 0 0 10" fill="none" stroke="rgba(255,255,255,0.1)" stroke-width="0.5"/>
</pattern>
</defs>
<rect x="50" y="50" width="100" height="80" fill="url(#grid)"/>
<!-- Floating design elements -->
<rect x="160" y="140" width="20" height="12" rx="6" fill="rgba(255,255,255,0.5)" stroke="rgba(255,255,255,0.3)" stroke-width="1"/>
<circle cx="30" cy="140" r="6" fill="rgba(255,255,255,0.3)" stroke="rgba(255,255,255,0.2)" stroke-width="1"/>
<!-- Typography indicator -->
<text x="25" y="180" fill="rgba(255,255,255,0.4)" font-family="serif" font-size="16" font-weight="bold">Aa</text>
<text x="150" y="180" fill="rgba(255,255,255,0.4)" font-family="sans-serif" font-size="12">UI/UX</text>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@@ -0,0 +1,34 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" fill="none">
<!-- Background circle -->
<circle cx="100" cy="100" r="90" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.2)" stroke-width="2"/>
<!-- Browser window -->
<rect x="40" y="60" width="120" height="80" rx="8" fill="rgba(255,255,255,0.9)"/>
<!-- Browser header -->
<rect x="40" y="60" width="120" height="20" rx="8" fill="rgba(59,130,246,0.8)"/>
<!-- Browser dots -->
<circle cx="50" cy="70" r="3" fill="rgba(239,68,68,0.8)"/>
<circle cx="60" cy="70" r="3" fill="rgba(245,158,11,0.8)"/>
<circle cx="70" cy="70" r="3" fill="rgba(34,197,94,0.8)"/>
<!-- Code lines -->
<rect x="50" y="90" width="60" height="3" rx="1.5" fill="rgba(59,130,246,0.6)"/>
<rect x="50" y="100" width="40" height="3" rx="1.5" fill="rgba(16,185,129,0.6)"/>
<rect x="50" y="110" width="80" height="3" rx="1.5" fill="rgba(139,92,246,0.6)"/>
<rect x="50" y="120" width="30" height="3" rx="1.5" fill="rgba(245,158,11,0.6)"/>
<!-- Mobile phone -->
<rect x="130" y="110" width="25" height="40" rx="4" fill="rgba(255,255,255,0.9)" stroke="rgba(255,255,255,0.3)" stroke-width="1"/>
<rect x="132" y="115" width="21" height="25" fill="rgba(59,130,246,0.3)"/>
<circle cx="142.5" cy="145" r="2" fill="rgba(255,255,255,0.7)"/>
<!-- Decorative elements -->
<circle cx="170" cy="80" r="8" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.2)" stroke-width="1"/>
<circle cx="30" cy="120" r="6" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.2)" stroke-width="1"/>
<!-- Code brackets -->
<text x="20" y="50" fill="rgba(255,255,255,0.4)" font-family="monospace" font-size="20" font-weight="bold">&lt;/&gt;</text>
<text x="160" y="170" fill="rgba(255,255,255,0.4)" font-family="monospace" font-size="16" font-weight="bold">{}</text>
</svg>

After

Width:  |  Height:  |  Size: 1.8 KiB