이미지로 스프라이트 시트 만들기

게임과 CSS에 쓸 애니메이션 프레임이나 아이콘을 스프라이트 시트 하나로 묶으세요. 열 수와 여백을 선택하면 Phaser, PixiJS 등 여러 엔진과 호환되는 JSON 아틀라스도 받을 수 있습니다.

이미지는 내 기기에서 처리되며 업로드되지 않습니다.

이미지를 여기에 끌어다 놓으세요

또는 끌어다 놓기

PNG, WEBP, GIF, JPG 지원 · 파일당 최대 512 MB

사용 방법

  1. 01

    애니메이션 순서대로 프레임을 추가하세요.

  2. 02

    열 수와 프레임 사이의 여백을 설정하세요.

  3. 03

    처리한 뒤 JSON 아틀라스 포함 여부를 선택해 스프라이트 시트를 다운로드하세요.

픽셀 단위로 정확한 프레임

프레임은 절대 크기가 조절되지 않습니다. 각 프레임은 같은 크기 셀의 왼쪽 위에 놓이며, 아틀라스에 정확한 위치와 크기가 기록됩니다.

엔진 친화적인 아틀라스

JSON은 널리 지원되는 TexturePacker 해시 형식을 사용하며 각 프레임의 파일 이름을 키로 합니다.

자주 묻는 질문

시트의 형식은 무엇인가요?

PNG이므로 투명도가 유지됩니다.

프레임 크기가 모두 같아야 하나요?

아니요. 셀은 가장 큰 프레임에 맞춰지며, 아틀라스에는 각 프레임의 실제 크기가 기록됩니다.

이미지가 업로드되나요?

아니요. 시트는 브라우저 안에서 만들어집니다.

관련 도구