이미지

픽셀아트·도트 그리기

격자에 도트를 찍어 픽셀아트를 그리고 PNG로 저장하거나 네모로직 문제로 만들기

파일이 서버로 전송되지 않아요 · 브라우저에서만 처리

픽셀아트·도트 그리기란?

격자의 한 칸 한 칸에 색을 칠해 도트 그림을 만드는 무료 도구입니다. 8×8 아이콘부터 64×64 캐릭터까지 크기를 고를 수 있고, 완성한 그림은 PNG로 저장하거나 네모로직 퍼즐로 바꿔 풀어볼 수 있습니다. 모든 작업은 브라우저 안에서만 이뤄지고 그림은 서버로 전송되지 않습니다.

사용법

연필로 칠하고 지우개로 지웁니다. 채우기는 같은 색으로 이어진 칸(상하좌우)을 한 번에 칠하고, 스포이드는 그림 속 색을 집어 옵니다. 직선은 끌어서 시작점과 끝점을 이은 선을 그립니다. 대칭을 켜면 좌우 대칭으로 함께 그려지고, Ctrl+Z / Ctrl+Y로 되돌리기·다시하기(최대 100단계)를 할 수 있습니다. 그리던 그림은 이 브라우저에 자동 저장되어 다시 열면 이어 그릴 수 있어요.

도트 그리기 팁
  • 실루엣부터 — 먼저 한 가지 색으로 전체 모양을 잡고, 그 위에 밝은 색·어두운 색을 얹으세요.
  • 색 수 제한 — 4~8색만 써도 충분합니다. 색이 적을수록 그림이 또렷하고 통일감이 생깁니다.
  • 안티에일리어싱 피하기 — 선 주변에 중간 톤을 흩뿌리면 도트가 지저분해 보입니다. 경계는 단단하게 끊어 주세요.
  • 대칭 활용 — 얼굴·캐릭터·아이콘처럼 좌우가 같은 그림은 대칭 모드로 절반만 그리면 됩니다.
저장 배율 안내

PNG 원본은 칸 하나가 1픽셀이라 그대로는 매우 작습니다. 저장할 때 배율(1·4·8·16·32배)을 정수배로 키워 두면 흐려지지 않고 또렷한 도트로 유지됩니다. 프로필 이미지·게임 스프라이트는 8~16배, 인쇄나 큰 화면용은 32배를 권장합니다. 배경은 투명으로 두거나 흰색으로 채울 수 있고, 격자선을 함께 넣을 수도 있습니다.

네모로직으로 만들기

그린 그림을 컬러 네모로직 퍼즐 링크로 바꿉니다. 투명한 칸은 빈 칸이 되고, 색이 많으면 최대 8색(기본 6색)으로 줄여 넘깁니다. 흰 바탕에 그렸다면 '흰색을 배경으로'(기본 켬)가 흰 칸을 빈 칸으로 처리합니다. '변환 설정'에서 흑백 모드로 바꾸면 밝기 기준보다 어두운 칸만 칠할 칸이 됩니다. 캔버스 크기는 상관없습니다. 버튼 한 번으로 새 탭에서 퍼즐이 열리고, 모드·색 수·제목은 '변환 설정'에서 선택적으로 바꿀 수 있습니다.

그린 그림은 서버에 저장되나요?
아니요. 그림은 이 기기의 브라우저(localStorage)에만 자동 저장되고 서버로 전송되지 않습니다. 브라우저 데이터를 지우면 사라지니, 보관하려면 PNG로 저장해 두세요.
캔버스 크기를 바꾸면 그림이 지워지나요?
지워지지 않습니다. 기존 그림은 좌상단을 기준으로 유지되고, 크기를 줄이면 바깥쪽 칸만 잘리며, 늘리면 새 칸은 투명으로 채워집니다. 실수했다면 되돌리기(Ctrl+Z)로 복구할 수 있습니다.
PNG를 크게 저장하면 왜 흐려지지 않나요?
저장 배율을 정수배로 키울 때 칸 하나를 같은 색의 정사각형 여러 개로 그대로 확대하기 때문입니다. 사진처럼 부드럽게 보간하지 않아 도트의 경계가 선명하게 유지됩니다.
네모로직 퍼즐은 어떤 그림이 좋은가요?
칠할 칸과 빈 칸이 적당히 섞인 단순한 실루엣 그림이 좋고, 캔버스가 너무 크면 풀이가 길어집니다. 색이 많은 그림은 변환 설정에서 최대 색 수를 조절해 미리보기로 확인한 뒤 만드세요(흑백 모드도 선택할 수 있어요).