가공하지 않은 스크린샷은 트윗, 슬라이드, 랜딩 페이지에 붙이면 밋밋해 보입니다. 이 도구는 스크린샷을 멋진 그라데이션(또는 단색) 위에 올리고, 숨 쉴 여백을 더하고, 모서리를 둥글리고, 아래에 부드러운 그림자를 드리웁니다 — 여기저기 상품 스크린샷에서 보이는 그 세련된 룩입니다. 소셜용 화면비를 고르거나 자동으로 두세요.
모든 것이 브라우저의 캔버스에서 실시간으로 합성되어 PNG로 내보내집니다. 개인 데이터가 담겼을 수 있는 스크린샷은 절대 업로드되지 않습니다.
사용 방법
- 스크린샷 추가꾸미고 싶은 이미지를 끌어다 놓으세요.
- 프레임 스타일 지정배경, 여백, 모서리 반경, 그림자를 고르고, 필요하면 화면비를 정하세요.
- PNG 내려받기소셜, 문서, 슬라이드에 바로 쓸 세련된 이미지를 저장하세요.
밋밋한 스크린샷을 제품 스크린샷으로
스크린샷 뷰티파이어는 여러분의 캡처를 배경 위에 놓고, 스크린샷이 대충 찍은 게 아니라 디자인된 것처럼 보이게 하는 세 가지를 더합니다. 이미지 주위의 여백, 스크린샷 자체의 둥근 모서리, 그리고 표면에서 살짝 띄우는 부드러운 드롭 섀도우죠. 프리셋 그라디언트, 단색, 또는 투명 배경을 고르고, 각 조절값을 조정하고, PNG로 내보내기 전에 미리보기가 실시간으로 갱신되는 것을 보세요.
모든 것이 여러분의 브라우저 안 canvas에서 구성되므로 스크린샷은 절대 업로드되지 않습니다. 스크린샷은 비공개 메시지, 청구서, 대시보드, 또는 URL 표시줄의 토큰을 담을 수 있으므로 이 점이 중요합니다. 섀도우를 더하겠다고 그런 것을 서버로 보내서는 안 되니까요. 계정도 없고, 페이지가 로딩된 뒤에는 오프라인으로 계속 작동합니다.
어디로 가든 알맞은 모양으로
이미지를 게시하는 곳마다 선호하는 모양이 있습니다. 슬라이드 자료와 넓은 소셜 카드에는 16:9로, 정사각형 인스타그램이나 링크드인 게시물에는 1:1로, 휴대폰 화면을 더 채우는 세로 이미지에는 3:4로 출력을 고정하거나, Auto로 두어 프레임이 스크린샷과 그 여백을 감싸게 하세요. 비율을 고정하면 여백이 프레임의 나머지를 채워, 내보내기가 어색한 잘림 없이 자리에 들어맞습니다.
배경을 투명으로 설정하면 PNG가 여백 영역이 비워진 채 내보내집니다. 여백, 코너 반경, 섀도우는 모두 유지되고, 섀도우 뒤의 채움만 사라집니다. Figma, Keynote, 또는 썸네일에서 여러분 자신의 배경 위에 놓는 버전이 바로 이것입니다.
이럴 때 사용해요
출시와 변경 이력 스크린샷 — 제품 스크린샷을 부드러운 그라디언트 위에 띄워, 릴리스 게시물이나 변경 이력이 날것이 아니라 의도한 모습으로 보이게 하세요.
다듬어진 트윗과 스레드 — 여백, 둥근 모서리, 은은한 섀도우를 더해 스크린샷이 주변 텍스트와 부딪치지 않게 하세요.
슬라이드 자료 — 깔끔한 배경으로 16:9로 내보내, 스크린샷이 발표 전반에 일관되게 놓이게 하세요.
정사각형 소셜 게시물 — 1:1로 고정해 넓은 스크린샷이 잘리지 않고 인스타그램이나 링크드인 그리드에 맞게 하세요.
Figma와 Keynote 에셋 — 투명 배경으로 내보내 둥근 모서리와 섀도우를 유지한 뒤, 여러분 자신의 레이아웃 위에 놓으세요.
문서 헤더 — 스크린샷을 단색 브랜드 색 위에 놓아, 문서나 위키의 깔끔하고 브랜드에 맞는 히어로 이미지로 만드세요.
밋밋한 스크린샷은 붙여 넣는 어디서나 초라해 보입니다
화면에서 곧장 딴 스크린샷은 네 면 모두 단단한 가장자리를 가진 픽셀 직사각형입니다. 그 자체로는 버그 리포트에 괜찮습니다. 하지만 트윗, 슬라이드, 랜딩 페이지 대표 이미지, Notion 문서에 떨구는 순간 미완성으로 보입니다. 주변 글자에 바짝 부딪히고, 모서리가 날카롭고 값싸 보이며, 이미지와 배경 사이에 분리가 없죠. 세련된 버전은 수백 번 봤을 겁니다. 부드러운 색 그라데이션 위에 떠 있는 제품 스크린샷, 주위에 약간의 여유 공간, 은은하게 둥근 모서리, 그리고 페이지에서 들려 보이게 하는 옅은 그림자. 그 모양은 필터나 스톡 템플릿이 아닙니다. 함께 쌓인 세 가지 작은 것이고, 이 도구는 정확히 그 세 가지를 합니다.
스크린샷을 캔버스에 떨구면 완성된 그림을 여러분의 브라우저에서 실시간으로 구성합니다. 배경—프리셋 그라데이션, 단색, 또는 투명—을 고르고, 스크린샷 주위에 여백을 얼마나 둘지 설정하고, 모서리 반경을 고르고, 드롭 섀도를 올리거나 내립니다. 진행하는 대로 미리보기가 갱신됩니다. 보기 좋으면 PNG를 내보냅니다. 이메일 스레드, 대시보드, 채팅, 계좌 번호 등 무엇이든 담을 수 있는 스크린샷은 <canvas> 요소에 곧장 그려지고 절대 탭을 떠나지 않습니다. 업로드도, 계정도 없고, 페이지가 로드되면 네트워크를 꺼도 계속 작동합니다.
여백, 둥글게, 그림자, 그라데이션이 실제로 하는 일
- 여백은 스크린샷이 가장자리끝까지 욱여넣어지지 않도록 여유를 줍니다. 그 틈이 원시 캡처가 아니라 표면에 의도적으로 놓인 물체로 읽히게 합니다.
- 둥근 모서리는 스크린샷 자체의 단단한 직각 넷을 부드럽게 합니다. 작은 변화지만 "잡은 것"이 아니라 "디자인된 것"으로 즉시 읽힙니다.
- 부드러운 드롭 섀도는 스크린샷을 배경에서 분리해, 평평하게 붙인 게 아니라 표면 위에 살짝 떠 있는 것처럼 보이게 합니다. 옅게 유지하세요. 그것이 무겁지 않게 깊이를 파는 비결입니다.
- 그라데이션(또는 단색) 배경은 여백을 색으로 채웁니다. 은은한 두 색 그라데이션이 그 앱 출시와 변경 로그 스크린샷이 비싸 보이는 가장 큰 단일 이유이고, 단색은 더 차분하고 브랜드에 맞는 대안입니다.
이것들이 함께 "제품 스크린샷" 모양이고, 그것이 이 도구의 전체 범위입니다. 더도 덜도 아닙니다.
갈 곳에 맞는 종횡비
출력은 Auto(프레임이 스크린샷 더하기 여백을 감쌈)이거나 16:9, 4:3, 1:1, 3:4로 고정할 수 있습니다. 비율이 중요한 이유는 게시하는 모든 곳이 선호하는 모양이 있기 때문입니다. 슬라이드 덱과 넓은 소셜 카드에는 16:9, 정사각형 인스타그램이나 LinkedIn 게시물에는 1:1, 휴대폰 화면을 더 채우는 세로 이미지에는 3:4죠. 비율을 고정하면 여백이 스크린샷 주위의 나머지 프레임을 채우므로, 내보내기가 어색하게 잘리지 않고 그 자리에 떨어집니다.
의도적인 투명 배경
배경을 투명으로 설정하면 여백 영역이 색 대신 비워진 채로 PNG가 내보내집니다. 둥근 모서리에 그림자가 있는 스크린샷을 Figma, Keynote, 또는 썸네일에서 여러분 자신의 배경 위에 놓을 때 원하는 것이죠. 여백, 반경, 그림자를 유지한 채 이미 가진 어떤 표면에든 떨굽니다. 그림자는 남고, 그 뒤의 채움만 사라집니다.
여기서 로컬 전용이 요점인 이유
스크린샷은 조용히, 여러분이 어떤 버전이든 공유하고 싶을 것 중 가장 사적인 것에 속합니다. 캡처 하나가 고객 이름, 청구서, 비공개 DM, 내부 지표, URL 표시줄의 토큰을 보여줄 수 있습니다. 그림자 하나 더하자고 이미지를 서버에 업로드해 "처리"하는 미화 도구는, 그 전부를 넘기라고 요구하는 것입니다. 여기서는 합성이 여러분 자신의 브라우저 안의 평범한 캔버스 작업이므로, 업로드할 것도 믿어야 할 것도 없습니다.
범위에 대한 솔직한 참고 하나: 이것은 그라데이션-여백-그림자 광택을 더하고 그 밖에는 아무것도 하지 않습니다. 스크린샷을 브라우저 크롬이나 휴대폰 프레임 목업으로 감싸지 않고, 화살표, 흐림, 주석을 더하지 않습니다. 한 번에 스크린샷 하나의 미화 모양입니다.
IMG.DIY를 선택하는 이유
그라데이션 또는 단색
프리셋 그라데이션이나 원하는 단색.
여백과 둥글리기
숨 쉴 공간과 둥근 모서리.
부드러운 그림자
떠 있는 느낌을 위한 조절 가능한 깊이.
안전함
로컬에서 합성 — 절대 업로드되지 않음.