톡테마이미지 준비 가이드
테마 만들기

준비할 이미지 40종

iOS 테마에 들어가는 이미지 전부입니다. 다만 전부 준비할 필요는 없습니다. 바꾸지 않은 것은 카카오 공식 샘플(26.7.0)의 기본 이미지가 그대로 들어갑니다. 배경 3장만 바꿔도 테마는 완성됩니다.

단, 23종은 반드시 교체해야 내려받을 수 있습니다

샘플에 카카오 캐릭터가 그려져 있는 이미지입니다. 그대로 둔 테마가 밖으로 나가면 안 되기 때문에 에디터가 다운로드를 막습니다. 아래 표에서 교체 필수 표시를 찾으면 됩니다.

공통 규칙

  • 한 장만 올리면 됩니다. @2x · @3x 판본은 올린 이미지로 자동 생성됩니다. 표의 크기는 가장 큰 판본 기준이라, 그만큼 이상으로 준비하면 어느 기기에서도 흐려지지 않습니다.
  • 비율이 다르면 잘립니다. 짧은 쪽을 채우도록 확대한 뒤 가운데를 잘라 씁니다. 올린 다음 어느 부분을 쓸지 끌어서 옮길 수 있습니다.
  • 투명이 필요하면 PNG. 탭 아이콘과 말풍선은 배경이 비어 있어야 합니다. JPG 는 배경 · 프로필처럼 꽉 찬 그림에만 쓰세요.
  • 색만 바꿀 거면 이미지는 필요 없습니다. 탭 바 배경, 말풍선처럼 색상 값이 따로 있는 항목은 이미지를 올리지 않는 편이 낫습니다 — 둘 다 지정하면 이미지가 이깁니다.

배경3종

가장 눈에 띄는 세 장. 여기만 바꿔도 테마가 완성돼 보인다

세로로 긴 사진이 맞는다. 가로 사진을 넣으면 크게 확대된 뒤 좌우가 잘려 나간다.

  • 친구 · 채팅 목록 배경

    mainBgImage.png

    1125×2250

    @3x

  • 채팅방 배경교체 필수

    chatroomBgImage.png

    1125×2250

    @3x

  • 잠금화면 배경

    passcodeBgImage.png

    정사각형이라 다른 배경과 비율이 다르다

    1200×1200

    @3x

탭 바17종

화면 아래 아이콘 줄. 평상시와 선택됐을 때 두 장이 한 쌍이다

배경이 투명한 PNG 로 준비한다. 국내 카카오톡에 실제로 보이는 것은 친구 · 채팅 · 오픈채팅 · 쇼핑 · 더보기이고, 콜 · 로컬 · 만화는 지역에 따라 나타난다.

  • 탭 바 배경

    maintabBgImage.png

    가로로 아주 긴 띠. 단색이면 색상 값으로 대신할 수 있다

    1410×147

    @2x · @3x

  • 친구교체 필수

    maintabIcoFriends.png

    114×114

    @2x · @3x

  • 친구 — 선택됨교체 필수

    maintabIcoFriendsSelected.png

    114×114

    @2x · @3x

  • 채팅교체 필수

    maintabIcoChats.png

    114×114

    @2x · @3x

  • 채팅 — 선택됨교체 필수

    maintabIcoChatsSelected.png

    114×114

    @2x · @3x

  • 오픈채팅교체 필수2곳에 사용

    maintabIcoNow.png

    국내 3번째 탭. 구버전 openchats 속성도 이 파일을 함께 쓴다

    114×114

    @2x · @3x

  • 오픈채팅 — 선택됨교체 필수2곳에 사용

    maintabIcoNowSelected.png

    114×114

    @2x · @3x

  • 쇼핑교체 필수

    maintabIcoShopping.png

    114×114

    @2x · @3x

  • 쇼핑 — 선택됨교체 필수

    maintabIcoShoppingSelected.png

    114×114

    @2x · @3x

  • 더보기교체 필수

    maintabIcoMore.png

    114×114

    @2x · @3x

  • 더보기 — 선택됨교체 필수

    maintabIcoMoreSelected.png

    114×114

    @2x · @3x

  • 콜교체 필수

    maintabIcoCall.png

    114×114

    @2x · @3x

  • 콜 — 선택됨교체 필수

    maintabIcoCallSelected.png

    114×114

    @2x · @3x

  • 로컬교체 필수

    maintabIcoLocal.png

    해외 3번째 탭. 국내에서는 보이지 않는다

    114×114

    @2x · @3x

  • 로컬 — 선택됨교체 필수

    maintabIcoLocalSelected.png

    114×114

    @2x · @3x

  • 만화교체 필수

    maintabIcoPiccoma.png

    일본 3번째 탭. 국내에서는 보이지 않는다

    114×114

    @2x · @3x

  • 만화 — 선택됨교체 필수

    maintabIcoPiccomaSelected.png

    114×114

    @2x · @3x

말풍선8종

보낸 쪽 · 받은 쪽 각각 4장

말풍선은 늘어나는 이미지라 모서리만 그리고 가운데는 단색으로 둔다. 어디까지 고정하고 어디부터 늘일지는 에디터의 말풍선 탭에서 픽셀로 지정한다. 색만 바꿀 거라면 이미지 대신 색상 값을 쓰는 편이 훨씬 쉽다.

  • 보낸 말풍선

    chatroomBubbleSend01.png

    120×105

    @2x · @3x

  • 보낸 말풍선 — 길게 눌렀을 때

    chatroomBubbleSend01Selected.png

    120×105

    @2x · @3x

  • 보낸 말풍선 — 단체방

    chatroomBubbleSend02.png

    120×105

    @2x · @3x

  • 보낸 말풍선 — 단체방 · 길게 눌렀을 때

    chatroomBubbleSend02Selected.png

    120×105

    @2x · @3x

  • 받은 말풍선

    chatroomBubbleReceive01.png

    120×105

    @2x · @3x

  • 받은 말풍선 — 길게 눌렀을 때

    chatroomBubbleReceive01Selected.png

    121×105

    @2x · @3x

  • 받은 말풍선 — 단체방

    chatroomBubbleReceive02.png

    120×105

    @2x · @3x

  • 받은 말풍선 — 단체방 · 길게 눌렀을 때

    chatroomBubbleReceive02Selected.png

    121×105

    @2x · @3x

잠금화면9종

비밀번호 자리 표시와 키패드

네 자리가 같은 모양이어도 파일은 따로 올려야 한다. 비어 있음 · 입력됨 두 상태가 구분돼 보여야 쓸모가 있다.

  • 비밀번호 1번째 자리 — 비어 있음

    passcodeImgCode01.png

    132×132

    @3x

  • 비밀번호 2번째 자리 — 비어 있음

    passcodeImgCode02.png

    132×132

    @3x

  • 비밀번호 3번째 자리 — 비어 있음

    passcodeImgCode03.png

    132×132

    @3x

  • 비밀번호 4번째 자리 — 비어 있음

    passcodeImgCode04.png

    132×132

    @3x

  • 비밀번호 1번째 자리 — 입력됨교체 필수

    passcodeImgCode01Selected.png

    132×132

    @3x

  • 비밀번호 2번째 자리 — 입력됨교체 필수

    passcodeImgCode02Selected.png

    132×132

    @3x

  • 비밀번호 3번째 자리 — 입력됨교체 필수

    passcodeImgCode03Selected.png

    132×132

    @3x

  • 비밀번호 4번째 자리 — 입력됨교체 필수

    passcodeImgCode04Selected.png

    132×132

    @3x

  • 키패드 눌림 표시

    passcodeKeypadPressed.png

    180×180

    @3x

그 외3종

프로필 · 버튼 · 테마 목록 아이콘

  • 기본 프로필교체 필수

    profileImg01.png

    사진을 등록하지 않은 친구에게 쓰인다

    360×360

    @3x

  • 친구 추가 버튼

    findBtnAddFriend.png

    126×102

    @2x · @3x

  • 테마 목록 아이콘교체 필수

    commonIcoTheme.png

    CSS 에 등장하지 않고 파일명 규약으로만 인식된다. 유일하게 1배수

    162×162

    @1x

테마 만들기

이미지는 브라우저 안에서만 처리되고 어디로도 전송되지 않습니다.