CSS Local Image Asset Embedder

How to use CSS Local Image Asset Embedder

Embed exact selected local image bytes into parsed CSS url() references and download a separate stylesheet with source-range evidence. Prepare a small portable stylesheet without manually pasting base64 strings or replacing URL-looking text inside comments and content strings. Match actual local image references to your selected files, preserve every unaffected source slice and inspect which bytes were embedded. The tool never applies input CSS, mounts HTML, opens an image URL or edits the originals.

1. Provide optional strict utf-8 stylesheet, css containing local image url() values, optional exact relative folder prefix, local static image assets.
2. Choose the supported mode and run the tool. Review its assumptions and any reported errors.
3. Copy the result or download a separate output; reset to clear the current form.

Good to know

• One strict UTF-8 stylesheet up to 100,000 bytes; a selected file takes precedence over pasted source. Original BOM, CRLF, comments and source outside replaced URL tokens remain unchanged. Literal NUL and malformed Unicode are refused. CSS Tree 3.2.1 parses the selected stylesheet; this is not a complete property-value or browser-rendering validator.
• Choose 1–16 nonempty images, at most 2 MiB combined and 4,000,000 aggregate declared pixels. Each image is bounded to 8 MiB, 1,000,000 pixels and 2,048 per side. Existing full structure/CRC preflight accepts static PNG, baseline JPEG or simple VP8/VP8L WebP; SVG, GIF, fonts, animated/extended/progressive images and compressed PNG metadata are refused. No native image decoder runs; structure checks do not certify all compressed image data will render.
• Selected filenames must be unique nonblank basenames within 200 UTF-8 bytes, without slash, backslash or control characters. An optional exact relative ASCII folder prefix of at most 100 characters and eight segments may be removed when present, such as ../images/. It is a literal string mapping, not a filesystem operation or path normalization; bare names remain allowed. The remaining URL value must be a relative basename: no scheme, separators, query, fragment or edge whitespace. CSS escape decoding precedes exactly one strict UTF-8 URI percent decoding. Encoded filename punctuation stays filename data; missing, ambiguous or invalid names refuse the whole export.
• At most 200 real URL references. Ordinary quoted/unquoted url() values and parsed custom-property URL tokens are supported. URL-looking strings/comments stay literal. Imports, charset/font/unknown at-rules, escaped URL-function aliases, src(), image() and image-set() forms are refused instead of being silently left unresolved. Supported grouping at-rules are media, supports, layer, container, keyframes, -webkit-keyframes, page and starting-style.
• Before AST construction, iterative tokenization caps 20,000 tokens and 40 balanced delimiter levels and refuses bad or unfinished lexical tokens. Recovered Raw nodes, parser errors, more than 20,000 AST nodes or 40 AST levels refuse. Future or unsupported CSS syntax may need simplifying; no partial stylesheet is returned.
• All URL source ranges and the resulting UTF-8 byte budget are planned before base64/output allocation. Repeated references copy the selected data URI again. Output is at most 4 MiB and readable evidence at most 100,000 characters. A same-origin module Worker completes the deferred CSS library import before a 10-second startup deadline, then has a separate 2-second computation deadline and terminates.
• Download embedded-images.css as an external CSS resource. Only whole URL token intervals are replaced; other source remains exactly authored and is not sanitized, HTML-escaped or minified. Do not treat arbitrary CSS as safe inline HTML. Original image bytes, including accepted metadata, are retained in the data URI; this is not metadata removal, optimization, ownership verification or secret redaction.
• The product page never injects the stylesheet. Loading it in your own page still depends on its selectors, document, browser, accepted codecs and your site data-image policy. Review the manifest, keep original backups and test the separate artifact before deploying it. No input is uploaded, no project directory is read, and no resource URL or remote stylesheet is fetched.
• Structured text output is limited to 500,000 characters. Reduce the supplied source when that separate output budget is exceeded.
• Inputs are processed on this device and are not automatically saved or uploaded.