SVG
Viewer
LOJBa27c
N/A
Send feedback
Terms & Conditions
Privacy Policy
Rotate
Flip Y
Flip X
-1px x -1px
Change dimensions
Optimize
2.17 KB
1.04 KB
-52%
Prettify
Preferences
Clear
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" height="200" width="200"> <defs> <style> @keyframes blink { 50% { opacity: 0; } } /* 흑백 스타일 정의 */ .bw-outline { stroke: #000000; stroke-width: 1.5; } .bw-fill-white { fill: #FFFFFF; } .bw-fill-black { fill: #000000; } .bw-no-fill { fill: none; } /* 노트북 흑백 스타일 (변경 없음) */ .laptop-body-bw { fill: #FFFFFF; stroke: #000000; stroke-width: 1.5; } .laptop-screen-bg-bw { fill: #000000; rx:1; ry:1; } .laptop-text-bw { font-family: 'Consolas', 'Courier New', monospace; font-size: 12px; fill: #FFFFFF; text-anchor: start; } .laptop-prompt-bw { font-weight: bold; } .laptop-initials-bw { font-weight: bold; } .laptop-cursor-bw { font-weight: bold; animation: blink 1s step-end infinite; } /* 맥주잔 흑백 스타일 */ .mug-body-bw { fill: #FFFFFF; stroke: #000000; stroke-width: 1.5; } /* === 거품 스타일 수정 === */ .mug-foam-bw { /* 클래스 이름 변경 및 fill 속성 추가 */ fill: #FFFFFF; /* 흰색 채우기 */ stroke: #000000; /* 검은색 외곽선 유지 */ stroke-width: 1.5; } /* ===================== */ .mug-handle-outline-bw { fill: none; stroke: #000000; stroke-width: 5; } </style> </defs> <g transform="translate(55, 51) scale(0.7)"> <rect class="laptop-body-bw" ry="8" rx="8" height="100" width="130" y="0" x="0"></rect> <path class="laptop-body-bw" d="M 10 100 L 120 100 Q 125 100, 128 105 L 135 110 L -5 110 L 2 105 Q 5 100, 10 100 Z"></path> <rect class="laptop-screen-bg-bw" height="70" width="100" y="15" x="15"></rect> <text class="laptop-text-bw" y="55" x="25"> <tspan class="laptop-prompt-bw">></tspan><tspan dx="5" class="laptop-initials-bw">H.P</tspan><tspan dx="5" class="laptop-cursor-bw">_</tspan> </text> </g> <g transform="translate(90, 60) scale(0.7)"> <path d="M 15 40 Q 25 25, 45 30 T 65 30 T 85 40 Z" class="mug-foam-bw"></path> <path d="M 20 40 L 20 120 Q 20 130, 30 130 L 70 130 Q 80 130, 80 120 L 80 40 Z" class="mug-body-bw"></path> <path d="M 80 60 C 100 70, 100 100, 80 110" class="mug-handle-outline-bw"></path> </g> </svg>
Upload
Copy
Download
Share
>
H.P
_
Preview
React
React Native
PNG
Data URI
>
H.P
_
100%
Download
SVG
Viewer
Edit
Export
Rotate
Flip Y
Flip X
-1px x -1px
Change dimensions
Optimize
2.17 KB
1.04 KB
-52%
Prettify
Preferences
Clear
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" height="200" width="200"> <defs> <style> @keyframes blink { 50% { opacity: 0; } } /* 흑백 스타일 정의 */ .bw-outline { stroke: #000000; stroke-width: 1.5; } .bw-fill-white { fill: #FFFFFF; } .bw-fill-black { fill: #000000; } .bw-no-fill { fill: none; } /* 노트북 흑백 스타일 (변경 없음) */ .laptop-body-bw { fill: #FFFFFF; stroke: #000000; stroke-width: 1.5; } .laptop-screen-bg-bw { fill: #000000; rx:1; ry:1; } .laptop-text-bw { font-family: 'Consolas', 'Courier New', monospace; font-size: 12px; fill: #FFFFFF; text-anchor: start; } .laptop-prompt-bw { font-weight: bold; } .laptop-initials-bw { font-weight: bold; } .laptop-cursor-bw { font-weight: bold; animation: blink 1s step-end infinite; } /* 맥주잔 흑백 스타일 */ .mug-body-bw { fill: #FFFFFF; stroke: #000000; stroke-width: 1.5; } /* === 거품 스타일 수정 === */ .mug-foam-bw { /* 클래스 이름 변경 및 fill 속성 추가 */ fill: #FFFFFF; /* 흰색 채우기 */ stroke: #000000; /* 검은색 외곽선 유지 */ stroke-width: 1.5; } /* ===================== */ .mug-handle-outline-bw { fill: none; stroke: #000000; stroke-width: 5; } </style> </defs> <g transform="translate(55, 51) scale(0.7)"> <rect class="laptop-body-bw" ry="8" rx="8" height="100" width="130" y="0" x="0"></rect> <path class="laptop-body-bw" d="M 10 100 L 120 100 Q 125 100, 128 105 L 135 110 L -5 110 L 2 105 Q 5 100, 10 100 Z"></path> <rect class="laptop-screen-bg-bw" height="70" width="100" y="15" x="15"></rect> <text class="laptop-text-bw" y="55" x="25"> <tspan class="laptop-prompt-bw">></tspan><tspan dx="5" class="laptop-initials-bw">H.P</tspan><tspan dx="5" class="laptop-cursor-bw">_</tspan> </text> </g> <g transform="translate(90, 60) scale(0.7)"> <path d="M 15 40 Q 25 25, 45 30 T 65 30 T 85 40 Z" class="mug-foam-bw"></path> <path d="M 20 40 L 20 120 Q 20 130, 30 130 L 70 130 Q 80 130, 80 120 L 80 40 Z" class="mug-body-bw"></path> <path d="M 80 60 C 100 70, 100 100, 80 110" class="mug-handle-outline-bw"></path> </g> </svg>
Upload
Copy
Download
Share
>
H.P
_
Preview
React
React Native
PNG
Data URI
>
H.P
_
100%
Download