이모지 파비콘이 조각나 보이는 이유

이모지로 파비콘을 만들 때 국기·가족·커플처럼 여러 요소가 합쳐진 이모지를 넣으면 미리보기가 조각나 보이는 경우가 있습니다.

이는 이모지가 기기마다 다르게 보이는 문제가 아니라, 입력값을 몇 글자까지만 받아들이는 글자 수 제한 때문입니다.

이 글은 어떤 이모지가 안전하고 어떤 이모지가 잘리는지, 그리고 도구 없이도 직접 확인하는 방법을 정리합니다.

요약 ① 이 도구는 입력한 문자를 유니코드 코드 포인트 기준 4개까지만 사용합니다. 화면에 보이는 이모지 1개가 실제로는 코드 포인트 여러 개로 이루어진 경우가 많습니다. ② 국기·가족·커플처럼 여러 요소가 이어붙는 이모지는 코드 포인트 수가 쉽게 4개를 넘어, 뒷부분이 잘리며 하나로 합쳐지지 않고 조각나 보일 수 있습니다. ③ 브라우저 콘솔에서 문자 수를 직접 세어 보면 어떤 이모지가 안전한지 도구 없이도 미리 알 수 있습니다.

이모지 파비콘이 왜 조각나 보일까

예를 들어 가족 이모지 "👨‍👩‍👧‍👦" 하나로 사이트 아이콘을 만들려는 경우를 생각해 봅니다. 화면에는 사람 네 명이 그려진 그림 하나로 보이지만, 실제로는 남자·연결기호·여자·연결기호·딸·연결기호·아들까지 코드 포인트 7개가 이어진 문자열입니다.

이 도구는 입력한 문자를 앞에서부터 코드 포인트 4개까지만 사용해 아이콘을 그립니다. 로켓(🚀)처럼 코드 포인트가 1개인 이모지는 문제가 없지만, 코드 포인트 7개로 이루어진 가족 이모지는 뒤쪽 절반이 잘려 나갑니다.

이때 하필 잘려 나가는 지점이 사람과 사람을 잇는 보이지 않는 연결 문자(ZWJ) 부근이라, 남은 문자만으로는 하나의 완성된 그림으로 합쳐지지 않습니다. 그 결과 앞쪽 인물 한둘만 따로 나열된 듯한 모습으로 남습니다.

도구 없이 코드 포인트 세는 법

어떤 이모지가 안전한지는 브라우저 개발자 도구만으로도 확인할 수 있습니다. 크롬이나 사파리에서 콘솔(F12)을 열고 다음처럼 입력해 봅니다.

[...'👨‍👩‍👧‍👦'].length

이 코드는 문자열을 유니코드 코드 포인트 단위로 펼쳐 개수를 셉니다. 가족 이모지는 7이 나오고, 로켓 하나는 1, 태극기 하나는 2가 나옵니다. 결과가 4보다 크면 이 도구에서 뒷부분이 잘린다는 뜻입니다.

국기 이모지는 특히 헷갈리기 쉽습니다. 태극기(🇰🇷) 하나는 코드 포인트 2개라 안전하지만, 두 나라 국기를 나란히 넣으면(🇰🇷🇺🇸) 정확히 4개로 경계에 걸치고, 세 나라째부터는 잘립니다.

저희 도구로 확인하기. 콘솔을 열어 직접 세는 대신, 이모지를 입력하자마자 128px 미리보기에서 잘렸는지 바로 눈으로 확인할 수 있습니다.

직접 해보기 →

자주 막히는 지점

실제로 코드 포인트 수를 세어 보면 다음과 같이 나뉩니다. 4개를 넘는 줄부터 뒷부분이 잘립니다.

정리

• 이 도구는 입력한 문자를 코드 포인트 4개까지만 사용해 아이콘을 그립니다.
• 눈에 보이는 이모지 1개가 코드 포인트 여러 개로 이루어진 경우가 흔합니다(국기 2개, 피부톤 적용 이모지 2개, 가족·커플처럼 ZWJ로 이어붙은 이모지는 6~7개).
• 코드 포인트 수가 4를 넘으면 뒷부분이 잘리고, 하필 연결 문자 중간에서 잘리면 하나로 합쳐지지 않고 조각난 모습이 남습니다.
• 브라우저 콘솔에서 [...문자열].length 로 미리 세어 보면 도구 없이도 안전한지 알 수 있습니다.
• 로켓·하트 같은 단일 코드 포인트 이모지나 국기 1~2개는 안전하고, 가족·커플·직업+피부톤 조합처럼 여러 요소가 이어진 이모지는 피하는 편이 안전합니다.

자주 묻는 질문

이모지를 여러 개 넣으면 왜 다 반영되지 않나요?

이 도구가 입력을 코드 포인트 4개로 제한하기 때문입니다. 로켓처럼 단순한 이모지는 코드 포인트가 1개씩이라 4개까지 나열할 수 있지만, 국기나 피부톤이 적용된 이모지는 하나만 넣어도 코드 포인트를 2개씩 차지해 여유가 그만큼 줄어듭니다.

국기 이모지는 몇 개까지 안전한가요?

국기 하나는 코드 포인트 2개이므로, 두 개까지는 정확히 4개에 맞아 그대로 표시됩니다. 세 개째부터는 코드 포인트가 6개가 되어 마지막 국기가 잘립니다.

가족이나 커플처럼 조합된 이모지가 유독 잘 깨지는 이유는 무엇인가요?

이런 이모지는 사람·하트 같은 기호 사이사이에 보이지 않는 연결 문자(ZWJ)가 들어가 코드 포인트 수가 6~7개까지 늘어납니다.

4개로 잘리는 지점이 이 연결 문자 부근일 때가 많아, 남은 문자들이 하나의 그림으로 합쳐지지 못하고 낱개로 나열된 것처럼 보이는 경우가 흔합니다.

만든 파비콘 모양이 다른 컴퓨터에서 열어보면 다르게 보이나요?

아니요. 이 도구는 이모지를 캔버스에 그려 고정된 PNG 이미지로 만들어 내려받게 하므로, 한 번 만든 이후에는 어떤 방문자가 열어봐도 같은 그림으로 보입니다.

다만 그 그림 자체는 아이콘을 만들 때 사용한 기기·브라우저에 설치된 이모지 글꼴 모양을 따르므로, 미리보기에 보이는 모습을 기준으로 판단하면 됩니다.