I’ve created a quick, simple tool that converts CSS file references (like url(images/someimage.png)) to inline image data (like url('data:....')). Written in C#, and available as an open source download (see below), the tool is a point-and-click alternative to manually making the data URIs.
To use the tool, follow these three steps:
- Open the CSS file you want to work with.
- Resolve the image references that CSS Image Embedder finds to actual files. Use Manual Resolve to manually resolve a single reference, or Auto Resolve to automatically resolve multiple references.
- Save the CSS file. The image references are automatically inlined when you save it.
In case you didn’t know, the data URI scheme lets you inline file references anywhere a `src` attribute is normally used. Wikipedia has a good description, as well as examples.
More instructions will follow soon on the Wiki, so stay tuned. Please comment if you like the tool, or have suggestions. Enjoy!
Download/read about it at BitBucket: https://bitbucket.org/MostThingsWeb/css-image-embedder