이미지 필터

이미지 필터는 모든 픽셀의 색상을 실시간으로 변환해 작동합니다. 각 필터는 각 픽셀의 빨강, 초록, 파랑 채널에 작은 수학 연산을 적용합니다: brightness(150%)는 1.5배로 곱해 이미지를 밝게 하고, grayscale(100%)는 채널을 평균 내어 단일 회색조로 만들고, blur(4px)는 컨볼루션 커널을 이용해 각 픽셀을 인접 픽셀과 혼합합니다. HTML canvas API를 통해 GPU에서 실행되므로, 슬라이더를 드래그하는 순간 미리보기가 즉시 업데이트됩니다——대기 없음, 업로드 없음, 서버 왕복 없음.

크게 두 그룹으로 나뉩니다. 조정 필터는 사진을 자연스럽게 유지하면서 색조와 색상을 변경합니다——밝기, 대비, 채도, 색조 회전이 여기에 해당합니다. 효과 필터는 이미지를 독특한 룩으로 재스타일링합니다——그레이스케일(흑백), 세피아(따뜻한 빈티지), 반전(네거티브), 블러(소프트 포커스), 투명도. 이 편집기는 9가지 CSS 필터 함수를 모두 제공합니다. 예를 들어 grayscale(100%)와 contrast(120%)를 쌓는 것이 바로 Vintage, Noir, Faded 같은 이름 있는 프리셋을 만드는 방법입니다.

위의 박스에 사진을 드래그하거나(클릭해서 찾아보기, 또는 Ctrl/Cmd+V로 붙여넣기도 가능), 프리셋 썸네일을 클릭하거나 조정 슬라이더를 드래그하세요. 미리보기가 실시간으로 업데이트되고, 전후 비교 핸들로 언제든지 원본과 비교할 수 있습니다. 결과가 마음에 들면 PNG 다운로드 또는 JPG 다운로드를 클릭해 원본 해상도로 저장하세요. 아무것도 업로드되지 않습니다——모든 과정이 브라우저에서 실행됩니다.

CSS filter 속성은 필터 함수 체인을 사용해 모든 HTML 요소에 그래픽 효과를 적용합니다: brightness(), contrast(), saturate(), grayscale(), sepia(), hue-rotate(), invert(), blur(), opacity(). 예를 들어 filter: contrast(120%) saturate(140%) sepia(15%); 는 강렬하면서 약간 따뜻한 느낌을 줍니다. 이 도구는 슬라이더를 움직이는 동안 정확한 문자열을 실시간으로 구성해주므로, 스타일시트에 직접 복사해 붙여넣기만 하면 됩니다.

인스타그램 스타일 필터는 기본 CSS 필터 함수의 프리셋 조합입니다. Clarendon과 유사한 룩은 대략 contrast(120%) saturate(135%), 빈티지 필름 느낌은 contrast(85%) brightness(110%) sepia(12%), 강렬한 Vivid 색조는 contrast(130%) saturate(160%)를 쌓습니다. 갤러리의 프리셋 썸네일을 클릭하면 사진에 즉시 적용되고, 개별 슬라이더로 더 세밀하게 조정할 수 있습니다. VSCO나 Lightroom 프리셋 같은 유료 편집기와 동일한 시각적 결과를——앱 없이, 구독 없이, 업로드 없이.

흑백: 그레이스케일을 100%로 설정하세요——B&W 프리셋이 클릭 한 번으로 처리하고, Noir는 극적인 효과를 위해 추가 대비를 더합니다. 세피아: 세피아 슬라이더를 높이세요; sepia(80%)는 클래식한 갈색 톤 프린트를 만들어냅니다. 빈티지: 두 가지를 결합하세요——Vintage 프리셋은 sepia(55%) contrast(108%) brightness(104%) saturate(120%)를 사용해 따뜻하고 부드럽게 바랜 필름 느낌을 연출합니다. 모두 브라우저에서 완전히 실행되며, 계정 없음, 업로드 없음, 대기 없음.

도구에 따라 다릅니다. Fotor, LunaPI, Pixlr 같은 많은 온라인 편집기는 처리를 위해 사진을 서버에 업로드합니다. 즉 이미지가 다른 사람의 기기에 저장되어 분석이나 모델 학습에 활용될 수 있습니다. UtiloKit의 이미지 필터는 브라우저 내의 HTML canvas에서 완전히 실행됩니다: 이미지는 로컬에서 읽히고, 로컬에서 처리되고, 로컬에서 다운로드됩니다——절대 업로드되지 않고, 저장되지 않으며, 본인 외에는 누구도 볼 수 없습니다.