프로젝트 소개

img2css는 이미지를 순수 CSS로 변환하는 웹 도구입니다. 주요 기술은 box-shadow만을 사용하여 그림을 재현하는 것입니다. 각 픽셀은 크기가 조정되어 단일 픽셀 div의 box-shadow로 설정되므로, img 태그나 background-image가 필요 없습니다. 프로젝트는 이 출력이 매우 커질 수 있으며, 다른 옵션이 없는 경우가 아니면 프로덕션에 권장되지 않는다고 언급합니다. 두 번째 출력 모드는 base64를 사용하여 전체 이미지 파일을 img 태그 안에 삽입하므로 외부 호스팅이 필요 없습니다. 이 도구는 호스팅된 웹 페이지를 통해 사용할 수 있습니다. README는 또한 코드에서 변환을 수행하려는 사람들을 위한 관련 프로그래매틱 라이브러리(canvas-image-utils)와 별도의 픽셀별 애니메이션 실험(morphin)을 안내합니다. 개발은 pnpm을 사용합니다: 로컬 작업을 위해 pnpm install 및 pnpm dev를 사용하고, pnpm build는 정적 사이트를 out/ 디렉토리에 작성합니다. main 브랜치에 푸시하면 사이트가 gh-pages 브랜치에 배포됩니다.