https://savoia.dev/Recent content in Home on savoia.devHugoko-krThu, 16 Jul 2026 00:00:00 +0000https://savoia.dev/posts/hello-savoia/Thu, 16 Jul 2026 00:00:00 +0000https://savoia.dev/posts/hello-savoia/도메인 고민이 제일 오래걸렸다.https://savoia.dev/about/Mon, 01 Jan 0001 00:00:00 +0000https://savoia.dev/about/<p>주인장 <code>dpark</code>입니다. 홈서버에 뭐굴릴까 고민하다가 만들어봤습니다.</p> <p>이 블로그는 Ai없이 최적화된 생체 cpu로만 작성됩니다.</p> <div class="code-block"> <pre tabindex="0"><code>about me - 에비스 맥주를 좋아합니다.</code></pre> <button class="copy-code-button">copy</button> </div>https://savoia.dev/sea/Mon, 01 Jan 0001 00:00:00 +0000https://savoia.dev/sea/<p>savoia.dev 전용 작은 바다. <br> 물고기를 그려서 아드리아해에 풀어주자.</p> <style> .sea-tank { position: relative; overflow: hidden; height: 320px; background: #2b96c4; } @media (prefers-color-scheme: dark) { .sea-tank { background: #0d3a57; } } .sea-fish { position: absolute; transition: none; } .sea-fish img { display: block; image-rendering: auto; filter: drop-shadow(0 2px 3px rgba(0,0,0,.25)); } .sea-name { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); font-size: .65rem; opacity: .7; white-space: nowrap; } .sea-empty { position: absolute; top: 45%; width: 100%; text-align: center; opacity: .6; } .sea-draw { margin-top: 1.5rem; } .sea-draw canvas { width: 100%; max-width: 480px; aspect-ratio: 8/5; touch-action: none; border: 1px solid #999; background: #fff; cursor: crosshair; } .sea-palette { display: flex; gap: .3rem; margin: .5rem 0; flex-wrap: wrap; } .sea-swatch { width: 22px; height: 22px; border: 1px solid #999; cursor: pointer; padding: 0; } .sea-swatch.active { outline: 2px solid currentColor; } .sea-tools { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; margin-bottom: .5rem; } .sea-tools button, .sea-submit { border: 1px solid #999; background: #f2f2f2; color: #222; padding: .25rem .7rem; cursor: pointer; } .sea-tools button:hover, .sea-submit:hover { background: #e5e5e5; } .sea-tools button.active { font-weight: bold; background: #ddd; } .sea-nameinput { border: 1px solid #999; background: #fff; color: #222; padding: .25rem .5rem; } @media (prefers-color-scheme: dark) { .sea-tools button, .sea-submit { background: #333; color: #eee; border-color: #666; } .sea-tools button:hover, .sea-submit:hover { background: #444; } .sea-tools button.active { background: #555; } .sea-nameinput { background: #222; color: #eee; border-color: #666; } } .sea-msg { margin-left: .5rem; font-size: .85rem; } </style> <div class="sea-tank" id="tank"></div> <div class="sea-draw" id="drawer"> <h3>🐟 물고기 그리기</h3> <p style="font-size:.85rem;opacity:.7;">오른쪽을 보게 그리면 헤엄칠 때 방향을 바꿔요구르트</p>