Command Palette

Search for a command to run...

무료 온라인 이미지 도구: 크기 조정, 압축, 변환 및 편집(2026)

무료 온라인 이미지 도구: 크기 조정, 압축, 변환 및 편집(2026)

T
Toolz Team
|Jun 29, 2026|18 최소 읽기

이미지 도구 모음의 일부

처음으로 client's 홈페이지가 실패했습니다 핵심 웹 바이탈 나 때문에 감사, 범인은 하나의 영웅 이미지: 디자이너가 Figma에서 바로 내보낸 4.2 MB PNG 워드 프레스 미디어 라이브러리에 떨어졌다. 그것은 1200 px 폭에 표시하고 3800 px에 저장되었습니다. 페이지는 스로틀 모바일 연결에 페인트 십일초했다. I & #39;d 그것을 출하.

그것은 WP 관리 시절이었고 나중에 구축한 모든 이미지 도구를 형성한 무언가를 가르쳐주었습니다 Toolz.dev: 대부분의 이미지 문제 aren't 편집 문제, they're 배관 문제. 잘못된 차원,잘못된 형식,압축 패스 없음. 당신은 don't 그 중 하나를 해결하기 위해 포토샵이 필요합니다. 당신은 한 가지 일을 잘하고 빠르게 실행 서너 개의 작은 도구가 필요합니다.

이 가이드는 각 것의 뒤에 추론 및 I've 가 저질러서 당신이 그들을 건너뛸 수 있다 그래야,매일 이미지 가동 - 크기 조정,압축, 체재 변환,및 배경 제거 -를 통해서 걷는다. Toolz.dev 에 각 공구는 당신의 브라우저에서 이미지를 완전하게 가공한다. 당신의 사진은 서버를 결코 만지지 않는다,사람이 일단 they're 클라이언트 일 또는 개인적인 사진을 취급하면 깨닫는 보다는 더 중요한.

TL;DR: 일반적인 작업의 경우 브라우저에서 100% 머물 수 있습니다: 이미지 크기 조정 치수를 수정하려면, 이미지 압축 파일 크기를 자르려면, 포맷 변환기 PNG/JPEG/ 사이를 이동하려면웹P/AVIF, 그리고 배경 제거제 깨끗한 제품 및 프로필 촬영의 경우. 업로드하는 것은 없습니다. 파일이 디스크에서 브라우저 탭으로 이동하여 그대로 유지됩니다. 올바른 최적화 순서는 거의 항상 크기를 조정한 다음 변환한 다음 압축하는 것입니다.


이미지를 업로드하는 대신 브라우저에서 이미지를 처리하는 이유는 무엇입니까?

대부분 "무료 온라인 이미지 tools" 아래 같은 방식으로 작업: 당신은 파일을 업로드,서버가 처리,당신은 결과를 다운로드합니다. 웹 페이지는 어딘가에 임대 기계 위에 얇은 피부입니다. 그 모델은 세 가지 문제가 있으며,개인 정보 보호는 가장 큰 것뿐입니다.

개인 정보 보호는 명백한 관심사입니다. 금수 조치 아래의 제품 샷,ID 사진,내부 대시 보드의 스크린 샷,개인 사진 - 사람들이 가장 자주 크기를 조정하거나 압축해야하는 이미지는 정확히 should't stranger's temp 디렉토리에 앉아 있어야하는 이미지입니다. "한 시간 후에 삭제 된 파일 " 할 수있는 약속입니다 't 감사.

대기 시간은 더 조용한 비용입니다. 사무실 Wi-Fi 를 통해 20MB 카메라 이미지 일괄을 업로드하는 것은 크기 조정 자체보다 오래 걸립니다. 브라우저 기반 도구는 왕복 여행을 건너 뜁니다 - & quot;upload" 파일이 메모리로 이동하기 때문에 즉각적입니다. I & # 39;m 이 제품 사진 폴더를 처리 할 때 그 차이는 커피 브레이크와 연속 흐름의 차이입니다.

그리고 나서 그들이 하나를 칠 때까지 아무도 언급하지 않는 벽이 있습니다: 파일 크기 캡,일일 제한, & quot;Pro 로 업그레이드하여 10 MB 이상의 이미지를 처리,& quot; 무료 계층의 워터 마크. 클라이언트 측 도구는 정확히 하나의 제한을 가지고 있으며,it & # 39;s 당신의 machine & # 39;s RAM.

탭에서 이 모든 것을 수행하는 기술은 수년 동안 표준이었습니다. HTML <canvas> element 와 그 2D 컨텍스트는 서버 없이 래스터 이미지를 디코딩,리샘플링, 재인코딩할 수 있습니다.The browser&#39;s own Image 디코더는 JPEG,PNG, WebP,그리고 점점 더 AVIF 를 처리합니다. There&#39;s 는 더 이상 단지 800 px 너비로 만들기 위해 인터넷을 통해 그림을 보낼 기술적 인 이유가 아닙니다.


이미지 크기를 올바른 크기로 어떻게 조정합니까?

크기 조정은 내가 대부분의 것에 도달하는 작업이며,바로 업스트림으로 치수를 얻는 것은 대부분의 성능 문제를 다운스트림에서 방지합니다. 내가 바라는 규칙 I&#39;d 는 더 일찍 내면화: 이제까지 표시 될 가장 큰 크기보다 훨씬 큰 이미지를 저장하지 마십시오.

워크플로 이미지 크기 조정 도구:

  1. 이미지를 도구로 드래그하거나 클릭하여 찾아보십시오.
  2. 대상 너비와 높이를 픽셀 단위로 입력합니다.
  3. 의도적으로 늘리려는 경우를 제외하고 종횡비를 계속 잠그십시오. 켜두면 너비를 변경하면 높이가 자동으로 조정되어 왜곡되지 않습니다.
  4. 리샘플링 방법을 선택하세요(이중 입방체는 사진의 안전한 기본값입니다; 선명하게 유지하려는 픽셀 아트의 경우 가장 가까운 이웃).
  5. 처리 및 다운로드.

외울만한 가치가있는 하나의 숫자는 Retina 승수입니다. 800 px 로 표시되는 슬롯은 대략 1600 px 로 이미지를 보유해야하므로 2× 화면에서 선명하게 유지됩니다 - 내가 처음으로 출하 한 3800 px 몬스터가 아니라 디스플레이 크기를 5 배가 아니라 두 배로 늘립니다.

Here&#39;s a use-case cheat sheet I keep pinned,because &quot;what width should this be&quot;는 모든 프로젝트에서 나오는 질문입니다:

사용 사례 목표 폭 종횡비 포맷
웹사이트 영웅 1920px 16:9 웹P
블로그/콘텐츠 이미지 1200px 3:2 또는 16:9 웹P
섬네일 320~400px 1:1 또는 4:3 웹P
인스타그램 포스트 1080px 1:1 JPEG
X / 트위터 인피드 1200px 16:9 JPEG
이메일 헤더 600px 3:1 JPEG
전자상거래 제품 1000~1500px 1:1 WebP 또는 PNG

Same image resized for different use cases including web hero, social media, thumbnail, and mobile

내가 아직도 코드 리뷰에서 볼 수있는 한 가지 실수는 끊임없이: 업 스케일링. 이미지 만들기 더 큰 그것의 근원 can&#39;t 보다는 결코 붙잡지 않은 세부사항을 발명하십시오 - 공구는 다만 새로운 화소를 보간하고,약 200%를 지나서 당신은 연약하고 흐릿한 결과를 얻습니다. 클라이언트가 500 px 로고를 보내고 2000 px 에 그것을 필요로 하는 경우에,정직한 대답은 &quot; 벡터 근원에서 그것을 재수출하고,&quot; 아닙니다 &quot; 그것을 확대하고 희망하십시오.&quot;


이미지를 손상시키지 않고 어떻게 압축합니까?

압축은 실제 페이지 무게 절감 효과가 있는 곳입니다. 이미지는 일반적으로 웹 페이지에서 가장 무거운 단일 항목이므로 이미지를 축소하는 것이 대부분의 사이트에서 수행할 수 있는 가장 높은 레버리지 성능 작업입니다.

두 종류가 있으며, 구별이 모든 것을 결정합니다:

손실 압축 인간의 눈이 놓칠 가능성이없는 데이터 - 미묘한 색상 변화, 고주파 텍스처를 버립니다. 80% 품질의 JPEG 는 종종 정상적인보기 크기에서 눈에 보이는 차이가없는 최대 품질의 동일한 이미지보다 60 – 70% 작습니다. 이것은 사진에 대해 원하는 것입니다.

무손실 압축 그것의 어떤을 버리기 없이 자료를 능률적으로 재배열한다; 감압된 심상은 화소에 대하여 화소 동일물이다. PNG 는 이 방법 작동합니다. 모든 화소가 문제 일 때 그것을 사용하십시오 - 로고,스크린샷, 도표,파삭파삭한 원본 또는 단단한 가장자리를 가진 무엇이든.

X-1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 이미지 압축 도구를 사용하면 커밋하기 전에 품질 수준을 설정하고 결과를 미리보고 파일 크기를 나란히 비교할 수 있습니다. 웹 사진에 대한 나의 정직한 기본값은 80% 품질입니다 - I & # 39; 많은 페이지에서 더 낮거나 높게 테스트했으며 80 은 실제보기 크기에서 원본에서 압축 된 버전을 알 수 없게되는 지점입니다. 전체 추론을 원한다면 이미지 압축 가이드 그 숫자가 왜 유지되는지 자세히 설명합니다.

Comparison showing original image vs compressed image with file sizes displayed

당황스러울 정도로 오랫동안 저지른 실수: 압축 전에 크기 조정. 3800 px 이미지를 압축 한 다음 1200 px 로 크기를 조정하면 압축 노력을 모두 픽셀 you&#39;re 버릴려고하고 최종 파일은 you&#39;d 가 다른 방법으로 한 경우보다 크고 나쁩니다. 먼저 크기를 조정 한 다음 작은 이미지를 압축하십시오. 항상.


실제로 어떤 이미지 형식을 사용해야 합니까?

형식 풍경은 이전보다 더 좋은 옵션을 가지고 좋은 문제입니다. Here&#39;s 내가 결정하는 방법, 마케팅 광택없이.

JPEG 는 보편적인 손실 형식입니다 - 어디서나 지원, 사진에 대 한 좋은, 투명도 없음. It&#39;s 안전한 대체 및 여전히 새로운 형식에 대 한 클라이언트 지원은 동전 뒤집기입니다 이메일에 대 한 올바른 호출.

PNG 는 가득 차있는 투명도를 가진 무손실입니다. It&#39;s 스크린샷,로고, 및 원본 또는 예리한 가장자리를 가진 무엇이든을 위한 정확한 선택입니다. 그것은 틀린 사진 선택 - PNG로 저장된 사진은 눈에 띄는 이점 없이 JPEG와 동일한 사진보다 몇 배 더 클 수 있습니다.

웹P 는 2026 년 웹에 대한 기본값입니다. 그것은 손실과 무손실을 모두 수행하고 투명성을 지원하며 비슷한 품질로 JPEG 보다 약 25 – 35% 작게 실행됩니다. 브라우저 지원은이 시점에서 효과적으로 보편적입니다. 새로운 site& # 39;s 이미지에 대해 하나의 형식을 선택해야한다면 이것이 바로 그것입니다.

아비프 더 단단한 아직도 압축 - 일반적으로 JPEG 보다는 더 작은 약 50% - 그라데이션 및 정밀한 짜임새의 우수한 취급으로. 트레이드 오프는 느린 기호화이고 that&#39;s 아주 좋 그러나 확실히 어디에나 아닙니다 지원합니다. 나는 a 에 있는 최고 선택으로 그것을 사용합니다 <picture> 아래에 WebP가 있는 요소입니다.

SVG isn&#39;t 는 전혀 래스터 형식입니다 - it&#39;s 벡터이므로 하나의 흐릿한 픽셀 없이 어떤 크기로도 확장됩니다. 로고,아이콘, 일러스트레이션에 사용하세요. Don&#39;t 는 사진을 그것으로 변환하려고 합니다.

이들 사이를 변환하는 것은 두 번의 클릭 작업입니다 포맷 변환기: 이미지를 드롭하고 대상 형식을 선택하고 품질을 조정하십시오. it&#39;s 손실, 다운로드. 실제 사이트에서 배송하는 패턴은 브라우저를 사용합니다&#39;s 자체 형식 협상:

<picture>
  <source srcset="hero.avif" type="image/avif">
  <source srcset="hero.webp" type="image/webp">
  <img src="hero.jpg" alt="Description" width="1200" height="675" loading="lazy">
</picture>

브라우저는 이해하는 첫 번째 형식을 선택하므로 최신 전화기는 AVIF를 얻고, 이전 전화기는 WebP를 얻고, 고대 전화기는 여전히 작동하는 JPEG를 얻습니다. 명시적인 점에 유의하세요 width 그리고 height- 그 aren&#39;t 장식, 그들은 레이아웃 공간을 예약 하 고 누적 레이아웃 시프트 승리입니다 이미지 로드 점프에서 페이지를 중지 합니다.


브라우저에서 이미지 배경을 어떻게 제거합니까?

Photoshop 에서 펜 도구를 사용하여 구독 도구 또는 20 분을 의미하는 데 사용되는 배경 제거. 이제 브라우저 탭에서 실행할 수 있을 만큼 작은 기계 학습 모델은 몇 초 안에 일반적인 경우를 처리합니다.

X-1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 배경 제거제 이미지를 분석하고,피사체를 배경에서 분리하는 픽셀 마스크를 구축하고,투명한 알파 채널이 있는 PNG 를 출력합니다. 업로드,잠시 기다림,가장자리 확인,다운로드. 모든 것이 로컬로 유지됩니다 - 모델이 머신에서 실행되므로 민감한 제품 샷도 절대 떠나지 않습니다.

그것은 당신이 그것을 싸울 기회를 줄 때 가장 잘 작동합니다: 심지어 조명,피사체와 그 뒤에있는 what&#39;s 사이의 적절한 대비,그리고 합리적으로 고해상도 소스. 머리카락,털, 그리고 희미한 가장자리는 여전히 이러한 모델이 어려움을 겪고있는 곳입니다 - 결과가 누군가 주위에 후광을 가지고 있다면&#39;s 머리,that&#39;s 실패 모드는 예상 할 수 있으며,당신이 멀리 구성 할 수있는 버그가 아닙니다. 포장 된 제품과 같은 깨끗한 가장자리의 주제는 거의 완벽하게 나옵니다.

Before and after comparison of background removal from cluttered to clean transparent background


What&#39;s 웹을 위한 이미지를 최적화하는 올바른 순서?

매번 I&#39;ve 이 순서를 건너뛰거나 순서 없이 수행,I&#39;ve 지불했습니다. 이 순서로 수행하면 출력이 더 작고 더 보기 좋습니다:

1 단계 - 크기를 조정하여 치수를 표시합니다. 이미지가 렌더링할 가장 큰 크기를 파악하고 Retina의 경우 두 배로 늘립니다 크기 조정 그것에. 이 단일 단계는 일반적으로 다른 어떤 것보다 파일 크기에 대해 더 많은 작업을 수행합니다. 왜냐하면 you&#39;re는 결코 볼 수 없었던 픽셀을 삭제하기 때문입니다.

2 단계 - 올바른 형식으로 변환. 개종시키다 webp (또는 대체 기능이있는 AVIF) 로의 사진. 로고와 스크린 샷을 PNG 로 유지하십시오. 정품 벡터 아트를 SVG 로 유지하십시오.

3 단계 - 목표 품질로 압축. 압축 손실이 있는 웹 이미지의 경우 약 80%에서 실제 크기로 결과를 눈알로 관찰합니다.

4 단계 - HTML로 책임감 있게 봉사하기. 사용 srcset 따라서 브라우저는 장치에 적합한 크기를 다운로드하고 추가합니다 loading="lazy" 접힌 부분 아래의 모든 것에 does&#39;t 초기 페인트를 차단합니다.

유지할 가치가있는 느슨한 성능 예산: 200 KB 미만의 영웅 이미지 (가장 큰 만족 페인트를 구동하므로 가장 중요합니다), 100 KB 미만의 일반 콘텐츠 이미지,30 KB 미만의 썸네일 및 10 KB 미만의 로고 - SVG 를 사용하고 you&#39;ll 은 일반적으로 시도하지 않고 그것을 이길 수 있습니다. 이러한 aren&#39;t 법칙,they&#39;re 냄새 테스트. 단일 이미지가 버킷을 지나치면 it&#39;s 는 두 번째 볼만한 가치가 있습니다.


자주 묻는 질문

최고의 무료 온라인 이미지 도구는 무엇입니까?

작업에 따라 다르므로 Toolz.dev 는 하나의 부풀어 오른 편집기가 아닌 집중된 도구로 분할합니다. 차원의 경우 사용하십시오 이미지 크기 조정. 파일 크기는 을 사용합니다 이미지 압축. 형식을 변경하려면 다음을 사용하십시오 포맷 변환기. 피험자를 격리하려면 다음을 사용하십시오 배경 제거제. 4 개 모두 무료이며 가입이 필요 없으며 브라우저에서 이미지를 완전히 처리합니다.

품질을 잃지 않고 이미지 크기를 어떻게 조정합니까?

다운스케일링 - 이미지를 작게 만들기 - 소스가 작은 크기 요구보다 더 많은 세부 사항을 갖기 때문에 품질이 거의 들지 않습니다. 가장 부드러운 결과를 위해 바이큐빅 리샘플링을 사용하십시오. 업스케일링은 위험한 방향입니다: 도구는 픽셀을 발명해야하므로 품질이 떨어지고 원래 크기의 약 200%를 지나면 부드러움이 명백해집니다. 훨씬 더 큰 버전이 필요할 때 작은 복사본을 확대하지 않고 원본 소스 파일로 돌아갑니다.

내 웹사이트에 어떤 이미지 형식을 사용해야 합니까?

사진과 대부분의 콘텐츠 이미지에 WebP 사용 - it&#39;s 2026 년 거의 보편적 인 지원을 제공하는 JPEG 보다 약 25 – 35% 작습니다. 로고 및 아이콘에 SVG 를 사용하여 어떤 크기에서도 선명하게 유지하십시오. 투명도가있는 무손실 품질이 필요할 때만 PNG 를 사용하십시오. 최대 압축을 원할 때 AVIF 에 도달하고 a 에서 WebP 대체와 페어링 할 수 있습니다 <picture> 요소.

압축하기 전이나 후에 크기를 조정해야합니까?

먼저 크기를 조정한 다음 압축합니다. 큰 이미지를 압축한 다음 축소하면 크기 조정 중에 버려지는 픽셀에 대한 노력이 낭비되고 최종 파일은 you&#39;d 가 올바른 순서로 수행한 경우보다 더 크고 품질이 낮아집니다. 먼저 크기를 조정한다는 것은 압축기가 더 작은 이미지에 작동하여 가장 작고 깨끗한 결과를 생성한다는 것을 의미합니다.

개인 사진이나 클라이언트 사진과 함께 온라인 이미지 도구를 사용하는 것이 안전합니까?

대부분의 온라인 이미지 도구는 사진을 처리하기 위해 서버에 사진을 업로드하는데,이는 비공개 또는 NDA 하의 모든 것에 대한 실질적인 관심사입니다. Toolz.dev 의 이미지 도구는 canvas API 를 사용하여 브라우저의 모든 클라이언트 측을 처리하고 배경 제거를 위해 브라우저 내 ML 모델을 사용하여 이미지를 장치에서 떠나지 않으므로 개인 사진,클라이언트 작업 및 기밀 제품 샷에 대해 they&#39;re safe.

WebP 와 AVIF 의 차이점은 무엇입니까?

둘 다 압축에 JPEG 와 PNG 를 이겼습니다. WebP 는 효과적인 보편적인 브라우저 지원을 가진 JPEG 보다는 더 작은 약 25–35%입니다,그것을 실제적인 과태에게 합니다. AVIF 는 압축을 더 밀어줍니다 - JPEG 보다는 더 작은 일반적으로 대략 50% - 그리고 그라디언트와 짜임새를 더 잘 취급합니다,그러나 더 천천히 부호화하고 isn&#39;t 를 아직도 확실히 사방 지원하십시오. 일반적인 접근은 모든 브라우저가 해독할 수 있는 제일 체재를 얻다 그래야 WebP 를 가진 AVIF 를 첫번째로 봉사하기 위한 것입니다.

이미지에서 배경을 무료로 제거하려면 어떻게 해야 하나요?

열다 배경 제거제를,당신의 심상을 안으로 떨어뜨리고,브라우저에서 모형은 주제를 검출하고 알파 수로를 가진 PNG 를 주는 투명도로 배경을 대체합니다. 그것은 주제와 배경 사이 명확한 대조 조차 점화와 더불어 베스트를 작동합니다. flyaway 머리와 같은 정밀한 세부사항은 어떤 자동적인 공구든지를 위한 단단한 케이스 아직도,그래서 당신이 결과에 의지하기 전에 가장자리를 검사합니다.

내 웹사이트 이미지가 페이지 속도를 늦추는 이유는 무엇입니까?

거의 항상 it&#39;s 세 가지 중 하나: 이미지는 표시 보다 훨씬 더 큰 저장 됩니다, it&#39;s 압축 되지 않은 PNG 사진 처럼 오래 된 형식으로, 또는 그것은 결코 압축 패스를 통해 실행 된 순서대로 그들을 수정-크기 조정은 차원을 표시, WebP로 변환, 다음 약 80% 품질로 압축-그리고 you&#39;ll 일반적으로 절반 이상 총 이미지 무게를 잘라, 이는 당신의 가장 큰 만족 페인트 점수에 직접 표시 됩니다.

100KB 미만의 이미지를 얻으려면 어떻게 해야 합니까?

이 순서로 작업하고 즉시 중지 you&#39;re 제한 아래: 이미지가 실제로 표시되는 차원으로 크기를 조정하고 WebP 로 변환 한 다음 80% 품질로 압축합니다. 일반적인 1600px 너비의 사진의 경우 조합은 60 ~ 120 KB 사이의 어딘가에 도착합니다. you&#39;re 여전히 이상 인 경우 치수를 더 축소하기 전에 품질을 70%로 떨어 뜨립니다 - 70%의 품질 손실은 눈에 띄게 작은 이미지보다 훨씬 덜 눈에 띕니다.

내 iPhone 에서 HEIC 사진을 JPG 로 변환 할 수 있습니까?

예..heic 파일을 에 드롭합니다 포맷 변환기 그리고 JPG,PNG, WebP 로 내보냅니다. HEIC 는 기본적으로 iPhone 이 저장하는 형식이며,잘 압축되는 동안 대부분의 Windows 앱,이전 브라우저 및 콘텐츠 관리 시스템은 여전히 열기를 거부합니다 - 이것이 바로 어디서나 업로드하기 전에 JPG 또는 WebP 로 변환하는 것이 일반적으로 안전한 이동인 이유입니다.

Frequently Asked Questions

It depends on the job, which is why toolz.dev splits them into focused tools rather than one bloated editor. For dimensions, use Image Resize. For file size, use Image Compress. For changing formats, use the Format Converter. For isolating subjects, use the Background Remover. All four are free, need no signup, and process images entirely in your browser.

Comments

0 comments

0/2000 characters

No comments yet. Be the first to share your thoughts!