태그

SVG 기술 블로그 글

SVG 태그가 달린 국내 IT 기업 기술 블로그 글을 최신순으로 모았습니다.

전체 6개최신 6개 표시

미리캔버스의 SVG 필터 활용기: 브라우저에서 이미지 보정하기

SVG 필터가 브라우저 렌더링 과정에서 어떻게 작동하는지, `fe*` 프리미티브와 `in`/`result`로 파이프라인을 구성하는 방식을 설명했습니다. 단순 보정은 CSS filter로, 복합 합성과 커스텀 효과는 SVG 필터로 나누어 선택하는 기준도 정리했습니다.

2026년 7월 29일

브라우저에서 이미지 보정을 구현할 때 SVG 필터를 활용하는 방법을 소개했습니다. 선언적 적용과 파이프라인 구성, React 연동의 장점을 중심으로 정리했습니다.

2025년 10월 10일

요기요는 디자인 시스템 아이콘을 개별 SVG 컴포넌트와 전용 라이브러리로 재구축했습니다. 자동 변환, 접근성, 토큰 연동, 변경 내역 자동화로 운영 효율을 높였습니다.

2025년 2월 20일

리브랜딩 후 사용자에게 오류처럼 보이던 UI icon을 폰트 기반 디자인과 명확한 가이드로 개선했습니다. 그 결과 VOC가 감소하고 아이콘 제작 리소스도 크게 줄었습니다.

2023년 12월 28일

SVG의 `viewBox`, `viewport`, `preserveAspectRatio` 개념을 정리하고 `meet`와 `slice`의 동작 차이를 설명했습니다.\n크기 관계에 따라 정렬 기준이 어떻게 달라지는지 예시로 살펴보았습니다.

2023년 12월 27일

SVG 도형을 추출해 ID와 그룹 단위로 CSS 애니메이션을 적용하는 방법을 정리했습니다. hover 이동, 클릭 색상 변경, 순차 등장 애니메이션까지 구현 과정을 소개했습니다.