πŸ”’
🎨

Encode Images to Base64 for CSS

Convert small images and icons to Base64 data URLs for embedding directly in CSS or HTML.

Nid oes angen mewngofnodi

CSS tips

🎨

Embed small SVG icons, favicons, or background images directly in your CSS as data URLs to eliminate extra HTTP requests.

πŸ“

Only embed images under ~5 KB as Base64. Larger images increase CSS file size significantly and are better served as separate files.

πŸ’‘

Base64 images in CSS look like: background-image: url("data:image/svg+xml;base64,PHN2Zy4uLg=="). Paste your encoded output after the comma.

⚑

For SVGs specifically, URL-encoding the raw SVG source is often more compact than Base64 β€” compare both before choosing.

Sut Mae'n Gweithio

1
Ewch i mewn
Enter your data into the tool above. Everything stays local to your browser.
2
Proses
The tool processes your data instantly in your browser using JavaScript. No server, no waiting.
3
Lawrlwythwch
Get your result instantly. Nothing is stored after you leave the page β€” complete privacy.

Pam defnyddio ein un ni?

βœ“Hollol rhad ac am ddim - dim costau cudd, byth
βœ“Nid oes angen cyfrif, e-bost na mewngofnodi
βœ“Nid yw ffeiliau byth yn gadael eich dyfais
βœ“Dim cyfyngiadau maint ffeil o gwbl
βœ“Dim dyfrnodau ar unrhyw allbwn

Also check out…

Cwestiynau Cyffredin