픽셀 아트 생성기

격자에 한 칸씩 정교하게 그리는 픽셀 아트 도구

픽셀 아트는 한 칸씩 설계하는 작업입니다. 이 편집기는 투명한 빈 격자에서 시작하며 각 논리 픽셀에 한 가지 색 또는 투명 상태를 저장합니다. 사진을 평균 색상의 큰 블록으로 바꾸지 않으므로 그런 작업에는 이미지 픽셀화 도구를 사용하세요. AI 프롬프트로 그림을 생성하는 기능도 없습니다.

작은 격자는 실루엣을 더 분명하게 다듬게 하고, 큰 격자는 명암과 장식을 표현할 공간을 줍니다. 다음은 플랫폼 규칙이 아닌 실용적인 시작점입니다.

확대해도 픽셀을 선명하게 유지하기

PNG는 정수 배율을 사용하고 이미지 보간을 끈 상태로 내보냅니다. 따라서 16×16 원본의 한 픽셀은 흐릿한 가장자리가 아니라 정확한 4×4, 8×8 또는 더 큰 정사각형이 됩니다. 바둑판 배경과 선택형 격자선은 편집 보조 표시일 뿐 파일에 포함되지 않습니다. 투명한 칸은 계속 투명하게 남습니다.

SVG는 가장자리가 선명한 사각형을 사용하고 투명한 칸은 생략합니다. 프로젝트 JSON은 편집 가능한 논리 격자와 작업 팔레트를 보존합니다. 이는 Hyperion 프로젝트 형식이며 데스크톱 픽셀 아트 프로그램의 레이어 형식을 대신하지 않습니다.

그리기 도구와 대칭 동작

• 연필은 칸을 색칠하고 빠르게 움직이는 포인터의 표본 사이를 이어 획이 끊기지 않게 합니다.
• 지우개는 칸을 투명 상태로 되돌립니다.
• 채우기는 상하좌우로 이어진 영역을 바꿉니다. 대각선으로만 닿은 영역은 따로 유지됩니다.
• 스포이트는 기존 칸의 색을 선택합니다. 투명한 칸을 고르면 지우개로 전환됩니다.
• 대칭 그리기는 동작을 좌우, 상하 또는 양방향으로 반사합니다. 가운데 행과 열은 한 번만 적용됩니다.

마우스, 펜, 터치, 키보드는 모두 같은 논리 격자를 조작합니다. 캔버스에 포커스를 둔 뒤 방향키로 활성 칸을 움직이고 Space 또는 Enter로 선택한 도구를 적용하세요. P, E, F, I는 도구 선택, Delete는 지우기, Ctrl/Cmd+Z는 실행 취소입니다.

브라우저 동작과 기술 참고 자료

편집기는 브라우저의 Canvas API, Pointer Events, Canvas의 이미지 스무딩 제어를 사용합니다. PNG 생성은 Canvas Blob 내보내기 API를 따릅니다. 키보드와 포인터 상호작용은 WCAG 2.2의 조작 가능성 지침을 고려해 설계했습니다.

작품, 이름, 팔레트는 브라우저 로컬 프로젝트 상태에만 머물며 URL이나 당사 서버 요청 데이터에 추가되지 않습니다. 퍼널 단계를 이동할 때는 일반 페이지 요청이 발생합니다. 탭 저장소를 사용할 수 없어도 전체 단일 페이지 편집기는 메모리에서 계속 동작하지만, 프로젝트가 조용히 사라지는 일을 막기 위해 퍼널은 다음 단계로 이동하지 않습니다.