60 lines
2.5 KiB
XML
60 lines
2.5 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
|
|
<style>
|
|
/* Global classes */
|
|
.tool-outline { stroke: #1A1714; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
|
|
.pouch-outline { stroke: #1A1714; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
|
|
|
|
.pouch-fill { fill: #5B8C3E; }
|
|
.pencil-shaft { fill: #EDE3D0; }
|
|
.pencil-wood { fill: #FBF6ED; }
|
|
.pencil-lead { fill: #5B8C3E; }
|
|
.ruler-fill { fill: #FFFBF2; }
|
|
.pen-fill { fill: #1A1714; }
|
|
|
|
.zipper-line { stroke: #FFFBF2; stroke-width: 1.2; stroke-dasharray: 1.2, 1.2; }
|
|
.zipper-pull { fill: #FFFBF2; stroke: #1A1714; stroke-width: 1.2; stroke-linejoin: round; }
|
|
.zipper-hole { fill: #1A1714; }
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
.tool-outline { stroke: #F2F2EF; }
|
|
.pouch-outline { stroke: #F2F2EF; }
|
|
|
|
.pouch-fill { fill: #A8FF60; }
|
|
.pencil-shaft { fill: #1E222D; }
|
|
.pencil-wood { fill: #161922; }
|
|
.pencil-lead { fill: #A8FF60; }
|
|
.ruler-fill { fill: #161922; }
|
|
.pen-fill { fill: #F2F2EF; }
|
|
|
|
.zipper-line { stroke: #0F1117; stroke-width: 1.2; stroke-dasharray: 1.2, 1.2; }
|
|
.zipper-pull { fill: #0F1117; stroke: #F2F2EF; stroke-width: 1.2; }
|
|
.zipper-hole { fill: #F2F2EF; }
|
|
}
|
|
</style>
|
|
|
|
<!-- Pencils, Pens, Rulers peeking from behind -->
|
|
<g id="tools">
|
|
<!-- Pencil (Left) -->
|
|
<rect class="pencil-shaft tool-outline" x="7" y="10" width="4" height="7" />
|
|
<polygon class="pencil-wood tool-outline" points="7,10 9,6 11,10" />
|
|
<polygon class="pencil-lead" points="8.2,8.4 9,6 9.8,8.4" />
|
|
|
|
<!-- Ruler (Center) -->
|
|
<rect class="ruler-fill tool-outline" x="14" y="5" width="4" height="12" />
|
|
<line class="tool-outline" x1="14.5" y1="8" x2="16.5" y2="8" stroke-width="1" />
|
|
<line class="tool-outline" x1="14.5" y1="11" x2="17.5" y2="11" stroke-width="1" />
|
|
<line class="tool-outline" x1="14.5" y1="14" x2="16.5" y2="14" stroke-width="1" />
|
|
|
|
<!-- Pen (Right) -->
|
|
<path class="pen-fill tool-outline" d="M 21,9 A 1.5,1.5 0 0,1 24,9 L 24,17 L 21,17 Z" />
|
|
<path class="tool-outline" d="M 24,11 H 25.5 V 14.5 H 24" fill="none" stroke-width="1.2" />
|
|
</g>
|
|
|
|
<!-- Pouch body in front -->
|
|
<g id="pouch">
|
|
<rect class="pouch-fill pouch-outline" x="4" y="15" width="24" height="12" rx="3.5" />
|
|
<line class="zipper-line" x1="4.5" y1="18.5" x2="27.5" y2="18.5" />
|
|
<rect class="zipper-pull" x="8" y="17" width="2.5" height="4.5" rx="0.8" />
|
|
<circle class="zipper-hole" cx="9.25" cy="19.25" r="0.6" />
|
|
</g>
|
|
</svg> |