코드 이미지 만들기

코드를 문법 강조된 예쁜 이미지로 만들어 바로 복사합니다

불러오는 중…

이 도구가 도움이 됐나요?

이 도구는

코드를 붙여넣으면 문법 강조된 이미지로 만들어 줍니다. 테마 아홉 가지, 배경 그라디언트와 투명 배경, macOS·Windows 창 장식, 줄 번호와 특정 줄 강조를 고를 수 있고, 만든 이미지는 내려받거나 클립보드로 바로 복사해 슬랙·블로그에 붙일 수 있습니다. 화면에 보이는 미리보기가 곧 내보낼 이미지라 받아보고 놀랄 일이 없습니다.

사용법

  1. 코드를 붙여넣습니다. 언어는 내용과 파일명을 보고 자동으로 잡습니다.
  2. 테마와 배경을 고르고 여백·글자 크기를 맞춥니다.
  3. 강조할 줄이 있으면 3,5-7 처럼 적습니다.
  4. 이미지 복사를 누르거나 PNG를 1x·2x·3x로 내려받습니다.

자주 묻는 질문

2x, 3x는 무엇인가요?
같은 그림을 두 배, 세 배 해상도로 그립니다. 레티나 화면이나 발표 슬라이드처럼 크게 볼 곳에는 2x 이상이 좋고, 블로그 본문에 넣을 때는 1x로도 충분합니다. 글자 크기는 그대로이고 픽셀만 촘촘해집니다.
이미지 복사가 안 됩니다.
브라우저가 이미지 클립보드를 지원하지 않는 경우입니다. 사파리 일부 버전과 오래된 브라우저가 그렇습니다. 그럴 때는 PNG 내려받기를 쓰세요.
한글 주석이 깨져 보입니다.
고른 글꼴에 한글이 없어서입니다. JetBrains Mono와 Fira Code는 영문 전용이라 한글은 시스템 글꼴로 대체됩니다. 한글이 많은 코드라면 시스템 고정폭이나 D2Coding을 고르세요.
설정 공유 링크에는 무엇이 들어가나요?
코드와 모든 설정이 주소의 # 뒤에 담깁니다. 그 부분은 브라우저가 서버로 보내지 않으므로 접근 기록에는 남지 않지만, 링크 자체에는 코드가 들어 있습니다. 비밀 코드는 공유하지 마세요.
왜 화면 캡처가 아니라 직접 그리나요?
화면을 캡처하는 방식은 브라우저마다 결과가 다르고, 웹폰트가 준비되기 전에 찍히면 글꼴이 통째로 바뀝니다. 캔버스에 직접 그리면 어느 브라우저에서 열어도 같은 이미지가 나옵니다.

코드는 브라우저 안에서만 처리되고 서버로 전송되지 않습니다. 문법 강조 규칙과 테마는 필요한 것만 그때그때 받아오므로, 처음 고른 언어나 테마는 잠깐 기다릴 수 있습니다.

비슷한 도구