Every favicon size from one image

Hand-exporting six icon sizes per site is tedious. Drop one image and get 16โ€“512px PNGs, the Apple touch icon, and site.webmanifest zipped in seconds.

PPPP

Drop a square image โ€” get every favicon size plus site.webmanifest as a ZIP.

favicon.ico, site.webmanifest, HTML ์Šค๋‹ˆํŽซ ํฌํ•จ

What you can do with ํŒŒ๋น„์ฝ˜ ์ƒ์„ฑ๊ธฐ

Everything this tool helps you accomplish โ€” no learning curve, no setup.

  • Generate every favicon size from one image
  • Create Apple touch and Android home-screen icons
  • Get a ready-to-use site.webmanifest file
  • Download all favicon sizes as a single ZIP
  • Add a crisp browser-tab icon to your website
Start now โ€” it's free
Uploads are encrypted in transitRemoved under our retention policy

ํŒŒ๋น„์ฝ˜ ์ƒ์„ฑ๊ธฐ ์ž‘์—…์„ ๋งˆ์น˜์…จ๋‚˜์š”? ๋‹ค์Œ ๋„๊ตฌ๋ฅผ ์‚ฌ์šฉํ•ด ๋ณด์„ธ์š”

ํŒŒ๋น„์ฝ˜ ์ƒ์„ฑ๊ธฐ์™€ ์ž˜ ์–ด์šธ๋ฆฌ๋Š” ์—„์„ ๋œ ๋„๊ตฌ์ž…๋‹ˆ๋‹ค. ํŒŒ์ผ์„ ์žƒ์ง€ ์•Š๊ณ  ๊ณ„์† ์ž‘์—…ํ•˜์„ธ์š”.

๋ชจ๋“  ๋„๊ตฌ ๋ณด๊ธฐ
PNGICO

ICO ๋ณ€ํ™˜๊ธฐ

Windows and browsers need .ico, not PNG. Convert PNG, JPG, or SVG into one multi-resolution .ico (16โ€“256 px) ready for favicons and desktop apps in seconds.

์ง€๊ธˆ ์‚ฌ์šฉํ•ด ๋ณด๊ธฐ
SVGPNG

SVG๋ฅผ PNG๋กœ ๋ณ€ํ™˜

Slack, docs, and most apps can't use SVG. Export your vector as a sharp PNG at 1ร—โ€“8ร— scale with a transparent, white, or custom background โ€” in seconds.

์ง€๊ธˆ ์‚ฌ์šฉํ•ด ๋ณด๊ธฐ
PNGWEBP

PNG๋ฅผ WebP๋กœ

PNGs are bloating your page load. Convert them to WebP at a fraction of the size with every transparent pixel intact โ€” in seconds.

์ง€๊ธˆ ์‚ฌ์šฉํ•ด ๋ณด๊ธฐ

์ด๋ฏธ์ง€-์Šคํ‹ฐ์ปค

Plain photos look out of place in chats. Cut the background, wrap a white outline around your subject, and export a sticker sized for WhatsApp, Telegram, and iMessage in seconds. Free to start.

์ง€๊ธˆ ์‚ฌ์šฉํ•ด ๋ณด๊ธฐ

์ด๋ฏธ์ง€ ํฌ๊ธฐ ์กฐ์ •

Wrong size for the platform? Set exact width and height or scale by percent, preview live, and download without quality loss โ€” in seconds. Free to start; batch resize with Premium.

์ง€๊ธˆ ์‚ฌ์šฉํ•ด ๋ณด๊ธฐ

์ปฌ๋Ÿฌ ํ”ผ์ปค

Stop guessing HEX codes from screenshots. Click any pixel for HEX, RGB, and HSL, or extract the dominant palette as JSON or CSS variables, right in your browser.

์ง€๊ธˆ ์‚ฌ์šฉํ•ด ๋ณด๊ธฐ

์ž์ฃผ ๋ฌป๋Š” ์งˆ๋ฌธ

์ตœ์‹  ๋ธŒ๋ผ์šฐ์ €์™€ ๊ธฐ๊ธฐ์—๋Š” ์—ฌ์„ฏ ๊ฐ€์ง€ ํฌ๊ธฐ๊ฐ€ ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค. ๋ธŒ๋ผ์šฐ์ € ํƒญ์šฉ 16ร—16๊ณผ 32ร—32, Windows ์‚ฌ์ดํŠธ ์•„์ด์ฝ˜์šฉ 48ร—48, Apple ํ„ฐ์น˜ ์•„์ด์ฝ˜(iOS ํ™ˆ ํ™”๋ฉด)์šฉ 180ร—180, Android ํ™ˆ ํ™”๋ฉด ๋ฐ PWA ์„ค์น˜ ์•ˆ๋‚ด์šฉ 192ร—192์™€ 512ร—512์ž…๋‹ˆ๋‹ค. Pixoate์˜ ์ƒ์„ฑ๊ธฐ๋Š” ํ•˜๋‚˜์˜ ์›๋ณธ ์ด๋ฏธ์ง€๋กœ ์ด ์—ฌ์„ฏ ๊ฐ€์ง€ ๋ชจ๋‘์™€ site.webmanifest๊นŒ์ง€ ๋งŒ๋“ค์–ด ๋ƒ…๋‹ˆ๋‹ค.

usage

๋Œ€๋ถ€๋ถ„์˜ ์ตœ์‹  ๋ธŒ๋ผ์šฐ์ €๋Š” PNG ๋งํฌ ํƒœ๊ทธ(rel="icon" type="image/png")๋ฅผ ์„ ํ˜ธํ•˜๋ฏ€๋กœ ICO ํŒŒ์ผ์€ ๋” ์ด์ƒ ํ•„์š”ํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์ €ํฌ๋Š” ๊ตฌ์‹ ICO๋ฅผ ์ƒ๋žตํ•˜๊ณ  ๋ชจ๋“  ์ตœ์‹  ๋Œ€์ƒ์— ๋งž๋Š” ํฌ๊ธฐ์˜ PNG ํŒŒ๋น„์ฝ˜์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. Internet Explorer๋‚˜ ์•„์ฃผ ์˜ค๋ž˜๋œ Chrome์„ ์ง€์›ํ•ด์•ผ ํ•œ๋‹ค๋ฉด PNG ์ค‘ ํ•˜๋‚˜๋ฅผ ๋ณ„๋„๋กœ ICO๋กœ ๋ณ€ํ™˜ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

technical

์›น ์•ฑ ๋งค๋‹ˆํŽ˜์ŠคํŠธ๋Š” ์‚ฌ์ดํŠธ๊ฐ€ ํ”„๋กœ๊ทธ๋ ˆ์‹œ๋ธŒ ์›น ์•ฑ์œผ๋กœ ์„ค์น˜๋  ๋•Œ ์–ด๋–ป๊ฒŒ ๋ณด์ผ์ง€(์•„์ด์ฝ˜, ์ด๋ฆ„, ํ…Œ๋งˆ ์ƒ‰์ƒ, ํ‘œ์‹œ ๋ชจ๋“œ)๋ฅผ Android, Chrome, Edge์— ์•Œ๋ ค์ฃผ๋Š” JSON ํŒŒ์ผ์ž…๋‹ˆ๋‹ค. ์ด ์ƒ์„ฑ๊ธฐ์—๋Š” Android Chrome ์•„์ด์ฝ˜์„ ๊ฐ€๋ฆฌํ‚ค๋Š” ์‹œ์ž‘์šฉ ๋งค๋‹ˆํŽ˜์ŠคํŠธ๊ฐ€ ํฌํ•จ๋˜์–ด ์žˆ์–ด, ์ด๋ฆ„๊ณผ theme_color๋งŒ ์ˆ˜์ •ํ•˜๋ฉด ๋ฉ๋‹ˆ๋‹ค.

features

512ร—512 ์ด์ƒ์˜ ์ •์‚ฌ๊ฐํ˜•(1:1) PNG๊ฐ€ ๋ชจ๋“  ํฌ๊ธฐ์—์„œ ๊ฐ€์žฅ ๊น”๋”ํ•œ ๊ฒฐ๊ณผ๋ฅผ ๋ƒ…๋‹ˆ๋‹ค. 16ร—16์—์„œ ์‚ฌ๋ผ์ ธ ๋ฒ„๋ฆฌ๋Š” ์„ธ๋ฐ€ํ•œ ๋””ํ…Œ์ผ์€ ํ”ผํ•˜์„ธ์š”. ํŒŒ๋น„์ฝ˜์€ ๊ตต๊ณ  ๋‹จ์ˆœํ•œ ํ˜•ํƒœ์™€ ๋†’์€ ๋Œ€๋น„์ผ ๋•Œ ๊ฐ€์žฅ ์ž˜ ๋ณด์ž…๋‹ˆ๋‹ค. ํˆฌ๋ช… PNG๋„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ, ์ด ๋„๊ตฌ๊ฐ€ ๋ ˆํ„ฐ๋ฐ•์Šค ์ฒ˜๋ฆฌํ•˜์—ฌ ์•„์ด์ฝ˜์ด ๋ชจ๋“  ํฌ๊ธฐ์—์„œ ์ค‘์•™์— ์˜ค๋„๋ก ํ•ฉ๋‹ˆ๋‹ค.

tips

์›๋ณธ ์ด๋ฏธ์ง€๋Š” HTTPS๋กœ ๋ณด์•ˆ ์„œ๋ฒ„์— ์—…๋กœ๋“œ๋˜๋ฉฐ, ์„œ๋ฒ„๊ฐ€ ๋ชจ๋“  ํŒŒ๋น„์ฝ˜ ํฌ๊ธฐ์™€ site.webmanifest๋ฅผ ๋ Œ๋”๋งํ•ด ZIP์œผ๋กœ ๋ฐ˜ํ™˜ํ•œ ๋’ค ์ฒ˜๋ฆฌ ํ›„ ์—…๋กœ๋“œ๋ฅผ ์ž๋™์œผ๋กœ ์‚ญ์ œํ•ฉ๋‹ˆ๋‹ค. ๋‹ค์šด๋กœ๋“œ์—๋Š” ์›Œํ„ฐ๋งˆํฌ๊ฐ€ ์—†๊ณ  ์•„๋ฌด๊ฒƒ๋„ ์ €์žฅ๋˜๊ฑฐ๋‚˜ ๊ณต์œ ๋˜์ง€ ์•Š์œผ๋ฏ€๋กœ ๋ฏธ๊ณต๊ฐœ ์ œํ’ˆ๊ณผ ์ถœ์‹œ ์ „ ๋ธŒ๋žœ๋“œ ์•„์ด๋ดํ‹ฐํ‹ฐ์—๋„ ์•ˆ์ „ํ•ฉ๋‹ˆ๋‹ค.

privacy

๋‹ค์šด๋กœ๋“œํ•œ ํŒŒ์ผ์˜ ์••์ถ•์„ ํ’€์–ด ์‚ฌ์ดํŠธ์˜ /public(๋˜๋Š” ์›น ๋ฃจํŠธ) ํด๋”์— ๋„ฃ์€ ๋’ค, ํฌํ•จ๋œ HTML ์Šค๋‹ˆํŽซ์„ <head>์— ์ถ”๊ฐ€ํ•˜์„ธ์š”. PNG ์•„์ด์ฝ˜์šฉ link ํƒœ๊ทธ์™€ site.webmanifest ๋งํฌ๊ฐ€ ๋“ค์–ด ์žˆ์Šต๋‹ˆ๋‹ค. ์‚ฌ์ดํŠธ๋ฅผ ๊ฐ•๋ ฅ ์ƒˆ๋กœ๊ณ ์นจ(Cmd+Shift+R)ํ•˜์„ธ์š”. ๋ธŒ๋ผ์šฐ์ €๋Š” ํŒŒ๋น„์ฝ˜์„ ์ ๊ทน์ ์œผ๋กœ ์บ์‹œํ•˜๋ฏ€๋กœ ์ƒˆ ์•„์ด์ฝ˜์ด ๋‚˜ํƒ€๋‚˜๋ ค๋ฉด ์บ์‹œ๋ฅผ ๋น„์›Œ์•ผ ํ•  ์ˆ˜๋„ ์žˆ์Šต๋‹ˆ๋‹ค.

usage

์˜ˆ โ€” 192ร—192์™€ 512ร—512 PNG๋Š” Chrome๊ณผ Edge๊ฐ€ ์‚ฌ์ดํŠธ๋ฅผ ์„ค์น˜ ๊ฐ€๋Šฅํ•œ PWA๋กœ ์ธ์ •ํ•˜๊ธฐ ์œ„ํ•ด ์ฐพ๋Š” ๋ฐ”๋กœ ๊ทธ ํŒŒ์ผ์ž…๋‹ˆ๋‹ค. ๋งค๋‹ˆํŽ˜์ŠคํŠธ์™€ ํ•จ๊ป˜๋ผ๋ฉด Lighthouse์˜ PWA ์„ค์น˜ ๊ฐ€๋Šฅ์„ฑ ๊ฒ€์‚ฌ๋ฅผ ํ†ต๊ณผํ•ฉ๋‹ˆ๋‹ค.

technical

Yes. Preview the favicon set before signup, then create a free account to download the ZIP without a watermark. The icon set is rendered on our servers, so signed-in free use has an allowance and Premium removes the cap.

pricing

ํŒŒ๋น„์ฝ˜์€ ๋ธŒ๋ผ์šฐ์ €๊ฐ€ ํƒญ์˜ ํŽ˜์ด์ง€ ์ œ๋ชฉ ์˜†, ์ฆ๊ฒจ์ฐพ๊ธฐ, ๋ฐฉ๋ฌธ ๊ธฐ๋ก์— ํ‘œ์‹œํ•˜๋Š” ์ž‘์€ ์•„์ด์ฝ˜์ž…๋‹ˆ๋‹ค. ๋ˆ„๊ตฐ๊ฐ€ ํœด๋Œ€ํฐ ํ™ˆ ํ™”๋ฉด์— ์‚ฌ์ดํŠธ๋ฅผ ์ถ”๊ฐ€ํ•˜๊ฑฐ๋‚˜ ์•ฑ์œผ๋กœ ์„ค์น˜ํ•  ๋•Œ ์‚ฌ์šฉ๋˜๋Š” ์•„์ด์ฝ˜์ด๊ธฐ๋„ ํ•ฉ๋‹ˆ๋‹ค. ์—ฌ๊ธฐ์— ๋กœ๊ณ ๋ฅผ ์—…๋กœ๋“œํ•˜๋ฉด ์ƒ์„ฑ๊ธฐ๊ฐ€ ์ „์ฒด ํŒŒ๋น„์ฝ˜ ์‚ฌ์ด์ฆˆ ์„ธํŠธ์™€ site.webmanifest๋ฅผ ํ•˜๋‚˜์˜ ZIP์œผ๋กœ ๋งŒ๋“ค์–ด ์ค๋‹ˆ๋‹ค.

usage

๋„ค โ€” ์—…๋กœ๋”๋Š” PNG๋ฟ ์•„๋‹ˆ๋ผ PNG, JPEG, WebP, SVG ์†Œ์Šค ํŒŒ์ผ์„ ๋ฐ›์Šต๋‹ˆ๋‹ค. SVG๊ฐ€ ์žˆ๋‹ค๋ฉด ์‚ฌ์šฉํ•  ๊ฐ€์น˜๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค. ๋ฒกํ„ฐ์ด๊ธฐ ๋•Œ๋ฌธ์— 16๋ถ€ํ„ฐ 512๊นŒ์ง€์˜ ๋ชจ๋“  ์ถœ๋ ฅ ํฌ๊ธฐ๊ฐ€ ๋ž˜์Šคํ„ฐ์—์„œ ํ™•๋Œ€๋˜๋Š” ๋Œ€์‹  ๋ฒกํ„ฐ ๋ฐ์ดํ„ฐ๋กœ๋ถ€ํ„ฐ ์ƒˆ๋กœ ๋ Œ๋”๋ง๋˜๋ฏ€๋กœ, 512ร—512์—์„œ๋„ ๊ฐ€์žฅ์ž๋ฆฌ๊ฐ€ ์„ ๋ช…ํ•˜๊ฒŒ ์œ ์ง€๋ฉ๋‹ˆ๋‹ค. JPEG์™€ WebP๋„ ์ž˜ ์ž‘๋™ํ•˜์ง€๋งŒ, JPEG๋Š” ์•ŒํŒŒ ์ฑ„๋„์„ ๊ฐ€์งˆ ์ˆ˜ ์—†์œผ๋ฏ€๋กœ ํˆฌ๋ช… ๋ถ€๋ถ„์„ ๋จผ์ € ๋ฐฐ๊ฒฝ ์œ„์— ํ‰๋ฉดํ™”ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.

technical

PNG ๋กœ๊ณ ๋ฅผ ์—…๋กœ๋“œํ•˜๋ฉด ์ƒ์„ฑ๊ธฐ๊ฐ€ ๋ธŒ๋ผ์šฐ์ €๊ฐ€ ์š”๊ตฌํ•˜๋Š” 16, 32, 48ํ”ฝ์…€ ๋ฒ„์ „์„ ๋ชจ๋‘ ๋‹ด์€ ๋‹ค์ค‘ ํ•ด์ƒ๋„ favicon.ico๋กœ ๋ณ€ํ™˜ํ•˜๊ณ , ์—ฌ๊ธฐ์— 6๊ฐ€์ง€ PNG ์‚ฌ์ด์ฆˆ์™€ site.webmanifest๊นŒ์ง€ ๋”ํ•ด ํ•˜๋‚˜์˜ ZIP ํŒŒ์ผ๋กœ ํŒจํ‚ค์ง•ํ•ฉ๋‹ˆ๋‹ค. JPEG, WebP, SVG ์›๋ณธ๋„ ์ง€์›๋˜๋ฏ€๋กœ ์ด๋ฏธ์ง€ ํŽธ์ง‘ ํ”„๋กœ๊ทธ๋žจ์„ ์—ด์ง€ ์•Š๊ณ ๋„ ์–ด๋–ค ๋กœ๊ณ  ํŒŒ์ผ์ด๋“  ํŒŒ๋น„์ฝ˜์œผ๋กœ ๋งŒ๋“ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

usage

ํŒŒ๋น„์ฝ˜ ์ƒ์„ฑ๊ธฐ๊ฐ€ ์ž‘์—…์„ ์™„์ˆ˜ํ•˜๋„๋ก ๋•๋Š” ๋ฐฉ๋ฒ•

๋น„์ฆˆ๋‹ˆ์Šค, ํฌ๋ฆฌ์—์ดํ„ฐ, ์ผ์ƒ ์ž‘์—…์—์„œ ๋งค์ผ ํ•ด๊ฒฐํ•˜๋Š” ์‹ค์ œ ๋ฌธ์ œ๋“ค. ๋‚˜์—๊ฒŒ ๋งž๋Š” ํ™œ์šฉ ์‚ฌ๋ก€๋ฅผ ์ฐพ์•„ ๋ช‡ ์ดˆ ๋งŒ์— ์‹œ์ž‘ํ•˜์„ธ์š”.

๊ฐœ๋ฐœ์ž์šฉ

์ธ๋”” ํ•ด์ปค ๋Ÿฐ์นญ

MVP๋ฅผ ์ถœ์‹œํ•˜๋Š” 1์ธ ์ฐฝ์—…์ž๋„ ๋Ÿฐ์นญ ์ „์— ์ž˜ ๋‹ค๋“ฌ์–ด์ง„ ํŒŒ๋น„์ฝ˜์ด ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค. ๋กœ๊ณ  ์ด๋ฏธ์ง€ ํ•œ ์žฅ์—์„œ ๋ชจ๋“  ํฌ๊ธฐ์˜ ํŒŒ๋น„์ฝ˜๊ณผ ๋งค๋‹ˆํŽ˜์ŠคํŠธ๋ฅผ ํด๋ฆญ ํ•œ ๋ฒˆ์œผ๋กœ ์ƒ์„ฑํ•˜์„ธ์š”. Figma๋„, ๋””์ž์ธ ๊ตฌ๋…๋„ ํ•„์š” ์—†์Šต๋‹ˆ๋‹ค.

๋น„์ฆˆ๋‹ˆ์Šค์šฉ

์—์ด์ „์‹œ ๊ณ ๊ฐ ์„ค์ •

์ƒˆ ํด๋ผ์ด์–ธํŠธ ์‚ฌ์ดํŠธ๋ฅผ ๋‚ฉํ’ˆํ•  ๋•Œ ํŒŒ๋น„์ฝ˜ ์„ธํŠธ๋Š” ๊ฒฌ์ ์— ์ž˜ ํฌํ•จ๋˜์ง€ ์•Š์ง€๋งŒ ํ•ญ์ƒ ๊ธฐ๋Œ€๋ฉ๋‹ˆ๋‹ค. ํ”„๋กœ์ ํŠธ ๋ง‰๋ฐ”์ง€์— ZIP์„ ์ƒ์„ฑํ•ด /public์— ๋„ฃ๊ณ  ๋‚ฉํ’ˆ ํ•ญ๋ชฉ์„ ์ฒดํฌํ•˜์„ธ์š”.

๊ฐœ๋ฐœ์ž์šฉ

PWA ์„ค์น˜ ๊ฐ€๋Šฅ์„ฑ

Chrome ์„ค์น˜ ๊ฐ€๋Šฅ์„ฑ ๊ฒ€์‚ฌ๋ฅผ ํ†ต๊ณผํ•˜๋ ค๋ฉด ๋งค๋‹ˆํŽ˜์ŠคํŠธ์— 192ร—192 ๋ฐ 512ร—512 ์•„์ด์ฝ˜์ด ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค. ๋‹น์‚ฌ์˜ ์ถœ๋ ฅ๋ฌผ์€ ๋ณ„๋„ ์„ค์ • ์—†์ด ์ด ์š”๊ตฌ ์‚ฌํ•ญ์„ ์ถฉ์กฑํ•˜๋ฉฐ, ์ด์— ๋งž๋Š” HTML head ํƒœ๊ทธ๋„ ํ•จ๊ป˜ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.

๋น„์ฆˆ๋‹ˆ์Šค์šฉ

๋ฉ€ํ‹ฐ ๋ธŒ๋žœ๋“œ ์›Œํฌ์ŠคํŽ˜์ด์Šค

์—ฌ๋Ÿฌ ๊ณ ๊ฐ ๋ธŒ๋žœ๋“œ๋ฅผ ๋™์‹œ์— ๊ด€๋ฆฌํ•˜๋Š” ์—์ด์ „์‹œ์™€ ์ปจ์„คํ„ดํŠธ๋Š” ๋ธŒ๋žœ๋“œ๋ฅผ ๋ฆฌ๋‰ด์–ผํ•  ๋•Œ๋งˆ๋‹ค ํŒŒ๋น„์ฝ˜ ์„ธํŠธ๋ฅผ 10์ดˆ ๋งŒ์— ๋‹ค์‹œ ๋งŒ๋“ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. Photoshop ์•ก์…˜์„ ๋”ฐ๋กœ ๊ด€๋ฆฌํ•  ํ•„์š”๊ฐ€ ์—†์Šต๋‹ˆ๋‹ค.

๊ฐœ๋ฐœ์ž์šฉ

์˜คํ”ˆ ์†Œ์Šค ํ”„๋กœ์ ํŠธ ๋ธŒ๋žœ๋”ฉ

GitHub Pages, Vercel, Netlify, Cloudflare Pages ์‚ฌ์ดํŠธ๋Š” ๋ชจ๋‘ ๋ธŒ๋ผ์šฐ์ € ํƒญ์—์„œ ๊น”๋”ํ•˜๊ฒŒ ๋ณด์ด๋ ค๋ฉด ํŒŒ๋น„์ฝ˜์ด ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค. ์ƒ์„ฑ๋œ ํŒŒ์ผ์„ ์ €์žฅ์†Œ์— ๋„ฃ๊ธฐ๋งŒ ํ•˜๋ฉด ํ”„๋กœ์ ํŠธ๊ฐ€ ์™„์„ฑ๋œ ๊ฒƒ์ฒ˜๋Ÿผ ๋ณด์ž…๋‹ˆ๋‹ค.

๋งˆ์ผ€ํŒ…

๋ฆฌ๋ธŒ๋žœ๋”ฉ ๋ฆฌํ”„๋ ˆ์‹œ

๋กœ๊ณ ๊ฐ€ ๋ฐ”๋€Œ๋ฉด 180px Apple ํ„ฐ์น˜ ์•„์ด์ฝ˜๊ณผ 512px Android PWA ์•„์ด์ฝ˜์„ ํฌํ•จํ•ด ํ•„์š”ํ•œ ๋ชจ๋“  ํฌ๊ธฐ๋ฅผ Illustrator์—์„œ ์ผ์ผ์ด ๋‹ค์‹œ ๋‚ด๋ณด๋‚ด์ง€ ์•Š๊ณ ๋„ ํ•œ ๋ฒˆ์— ์žฌ์ƒ์„ฑํ•˜์„ธ์š”.

๊ฐœ๋ฐœ์ž์šฉ

๋ธŒ๋ผ์šฐ์ € ํ™•์žฅ ํ”„๋กœ๊ทธ๋žจ ๋งค๋‹ˆํŽ˜์ŠคํŠธ์šฉ ์•„์ด์ฝ˜

ZIP์—์„œ ๋ฐ”๋กœ 16, 32, 48px PNG๋ฅผ ๊บผ๋‚ด manifest.json์˜ icons ๊ฐ์ฒด์— ์‚ฌ์šฉํ•˜์„ธ์š”. ๋””์ž์ธ ๋„๊ตฌ์—์„œ ๊ฐ ํฌ๊ธฐ๋ฅผ ์ผ์ผ์ด ์†์œผ๋กœ ๋‚ด๋ณด๋‚ด์ง€ ์•Š๊ณ ๋„ ๊ทœ๊ฒฉ์— ๋งž๋Š” ํ™•์žฅ ํ”„๋กœ๊ทธ๋žจ ์•„์ด์ฝ˜์„ ๋น ๋ฅด๊ฒŒ ์–ป๋Š” ๋ฐฉ๋ฒ•์ž…๋‹ˆ๋‹ค.

์›น ๋ฐ SEO

๋…ธ์ฝ”๋“œ ์‚ฌ์ดํŠธ์˜ ํŒŒ๋น„์ฝ˜ ๊ณต๋ฐฑ ์ฑ„์šฐ๊ธฐ

Webflow, Framer, Wix๋Š” ์ž์ฒด์ ์œผ๋กœ ์™„์ „ํ•œ ํŒŒ๋น„์ฝ˜ ์„ธํŠธ๋ฅผ ์ƒ์„ฑํ•˜๋Š” ๊ฒฝ์šฐ๊ฐ€ ๋“œ๋ญ…๋‹ˆ๋‹ค. ์—ฌ๊ธฐ์— ๋กœ๊ณ ๋ฅผ ์—…๋กœ๋“œํ•˜๊ณ  ์ƒ์„ฑ๋œ ํฌ๊ธฐ์™€ HTML ์Šค๋‹ˆํŽซ์„ ์‚ฌ์ดํŠธ์˜ ์‚ฌ์šฉ์ž ์ง€์ • ์ฝ”๋“œ ๋˜๋Š” SEO ์„ค์ • ํŒจ๋„์— ๋ช‡ ๋ถ„ ๋งŒ์— ๋ถ™์—ฌ๋„ฃ์œผ์„ธ์š”.

๊ฐœ์ธ์šฉ

์ทจ๋ฏธ ๋ธ”๋กœ๊ทธ์— ์™„์„ฑ๋œ ๋Š๋‚Œ ๋”ํ•˜๊ธฐ

Ghost, Jekyll, Hugo๋กœ ๋งŒ๋“  ๊ฐœ์ธ ๋ธ”๋กœ๊ทธ๋Š” ํŒŒ๋น„์ฝ˜์ด ์•„์˜ˆ ์—†๋Š” ๊ฒฝ์šฐ๊ฐ€ ๋งŽ์Šต๋‹ˆ๋‹ค. ์ธ๋ฌผ ์‚ฌ์ง„์ด๋‚˜ ์†์œผ๋กœ ๊ทธ๋ฆฐ ๋กœ๊ณ ์—์„œ ์ „์ฒด ์„ธํŠธ๋ฅผ ์ƒ์„ฑํ•ด, ๋ธŒ๋ผ์šฐ์ € ํƒญ์ด ๋น„์–ด ๋ณด์ด์ง€ ์•Š๊ณ  ์˜๋„์ ์œผ๋กœ ๋””์ž์ธ๋œ ๊ฒƒ์ฒ˜๋Ÿผ ๋ณด์ด๊ฒŒ ํ•˜์„ธ์š”.

๋งˆ์ผ€ํŒ…

SEO ๊ฐ์‚ฌ์—์„œ ์ง€์ ๋œ ํŒŒ๋น„์ฝ˜ ์ˆ˜์ •

๋ˆ„๋ฝ๋˜๊ฑฐ๋‚˜ ๊นจ์ง„ favicon์€ Lighthouse์™€ SEO ํฌ๋กค๋Ÿฌ ๋ณด๊ณ ์„œ์—์„œ ํ”ํžˆ ์ง€์ ๋˜๋Š” ๋ฌธ์ œ์ด๋ฉฐ, ๊ฒ€์ƒ‰ ๊ฒฐ๊ณผ์™€ ๋ถ๋งˆํฌ์—์„œ ํด๋ฆญ๋ฅ ์„ ์กฐ์šฉํžˆ ๋–จ์–ด๋œจ๋ฆฝ๋‹ˆ๋‹ค. ์—…๋กœ๋“œ ํ•œ ๋ฒˆ์œผ๋กœ ์ „์ฒด ์„ธํŠธ๋ฅผ ๋‹ค์‹œ ์ƒ์„ฑํ•˜๊ณ  ์˜ค๋Š˜ ๊ทธ ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜์„ธ์š”.

์ง€๊ธˆ ํŒŒ๋น„์ฝ˜ ์ƒ์„ฑ๊ธฐ๋ฅผ ์‚ฌ์šฉํ•ด ๋ณด์„ธ์š” โ€” ๋ฌด๋ฃŒ์ž…๋‹ˆ๋‹ค