SVG → CSS

SVG를 CSS background-image 용 data URI로 변환합니다. URL 인코딩과 Base64를 고를 수 있고 미리보기를 제공합니다. 무료.

이 도구는

SVG를 CSS background-image 용 data URI로 바꿉니다. URL 인코딩은 결과가 짧고 읽기 쉽고, Base64도 고를 수 있습니다.

사용 방법

SVG를 붙여넣습니다.
URL 인코딩과 Base64 중에서 고릅니다.
CSS 선언을 복사하고 미리보기를 확인합니다.

자주 묻는 질문

URL 인코딩과 Base64 중 무엇이 낫나요?

URL 인코딩이 보통 더 짧고 읽기 쉽습니다. 특수문자를 잘못 처리하는 도구에서는 Base64가 안전합니다.

xmlns가 추가된 이유는?

data URI로 쓰는 SVG는 xmlns="http://www.w3.org/2000/svg"가 있어야 그려지므로 없으면 넣어 줍니다.

공백도 줄어드나요?

네. 줄바꿈과 태그 사이 공백을 줄여 결과를 짧게 만듭니다.

관련 도구

Base64 이미지 인코딩 / 디코딩 – 이미지를 data URI로 바꾸고 Base64 이미지 미리보기
색상 변환기 – HEX, RGB, HSL, HWB, CMYK 상호 변환
HTML → JSX – HTML 마크업을 React JSX로 변환

포맷

JSON 포맷 / 검증 – JSON 정렬, 압축, 문법 검사
줄 정렬 / 중복 제거 – 줄 정렬, 중복 제거, 뒤집기, 공백 정리

인코딩 / 디코딩

Base64 인코딩 / 디코딩 – 텍스트를 Base64로 변환 (UTF-8)
URL 인코딩 / 디코딩 – URL 퍼센트 인코딩과 디코딩
HTML 엔티티 인코딩 / 디코딩 – HTML 엔티티 이스케이프와 해제
Base64 이미지 인코딩 / 디코딩 – 이미지를 data URI로 바꾸고 Base64 이미지 미리보기
백슬래시 이스케이프 / 해제 – 따옴표, 줄바꿈, 제어 문자 이스케이프
Hex ↔ ASCII – 텍스트와 16진수 바이트 상호 변환
JWT 디버거 – JSON Web Token 헤더와 페이로드 해석

생성

UUID / ULID 생성 / 분석 – UUID v4 / v7, ULID 생성과 기존 ID 분석
해시 생성기 – MD5, SHA-1, SHA-256, SHA-384, SHA-512 해시
랜덤 문자열 생성기 – 암호학적으로 안전한 랜덤 문자열
Lorem Ipsum 생성기 – 문단·문장·단어 단위 더미 텍스트
QR 코드 생성 / 읽기 – QR 코드를 만들고 이미지에서 읽기

변환

세계 시간 변환 – 시간대 간 시각 변환 (기본값: 이 컴퓨터의 현재 시각)
유닉스 시간 변환 – 유닉스 타임스탬프와 날짜 문자열 변환
진법 변환기 – 2진수, 8진수, 10진수, 16진수 상호 변환
YAML ↔ JSON – YAML과 JSON 상호 변환
CSV ↔ JSON – CSV와 JSON 상호 변환
HTML → JSX – HTML 마크업을 React JSX로 변환
쿼리 문자열 ↔ JSON – URL 쿼리 문자열과 JSON 상호 변환
URL 파서 – URL을 구성 요소와 쿼리 파라미터로 분해
색상 변환기 – HEX, RGB, HSL, HWB, CMYK 상호 변환
SVG → CSS – SVG를 CSS 배경용 data URI로 변환
JSON ↔ PHP 배열 – JSON과 PHP 배열 문법 상호 변환
PHP Serialize / Unserialize – JSON과 PHP serialize() 형식 상호 변환

텍스트

정규식 테스터 – 정규식을 테스트하고 매치 결과 확인
문자열 케이스 변환 – camelCase, snake_case, kebab-case 등
문자열 분석 – 글자·바이트·단어 수와 코드 포인트 확인
텍스트 비교 – 두 텍스트를 줄·단어·글자 단위로 비교

검사

Cron 식 해석 – cron 식 설명과 다음 실행 시각
cURL 분석 – cURL 명령을 분해하고 fetch() 코드로 변환
X.509 인증서 디코더 – PEM 인증서와 체인 분석

미리보기

Markdown 미리보기 – GitHub 스타일 Markdown 렌더링
HTML 미리보기 – 격리된 프레임에서 HTML 렌더링