← ClaudeAtlas

snapdomlisted

snapDOM is a fast, accurate DOM-to-image capture tool that converts HTML elements into scalable SVG images. Use for capturing HTML elements, converting DOM to images (SVG, PNG, JPG, WebP), preserving styles, fonts, and pseudo-elements.
aiskillstore/marketplace · ★ 329 · Web & Frontend · score 79
Install: claude install-skill aiskillstore/marketplace
# SnapDOM Skill Fast, dependency-free DOM-to-image capture library for converting HTML elements into scalable SVG or raster image formats. ## When to Use This Skill Use SnapDOM when you need to: - Convert HTML elements to images (SVG, PNG, JPG, WebP) - Capture styled DOM with pseudo-elements and shadows - Export elements with embedded fonts and icons - Create screenshots with custom dimensions or scaling - Handle CORS-blocked resources using proxy fallback - Implement custom rendering pipelines with plugins - Optimize performance on large or complex elements ## Key Features ### Universal Export Options - **SVG** - Scalable vector format, embeds all styles - **PNG, JPG, WebP** - Raster formats with configurable quality - **Canvas** - Get raw Canvas element for further processing - **Blob** - Raw binary data for custom handling ### Performance - Ultra-fast capture (1.6ms for small elements, ~171ms for 4000×2000) - **No dependencies** - Uses standard Web APIs only - Outperforms html2canvas by 10-40x on complex elements ### Style Support - Embedded fonts (including icon fonts) - CSS pseudo-elements (::before, ::after) - CSS counters - CSS line-clamp - Transform and shadow effects - Shadow DOM content ### Advanced Capabilities - Same-origin iframe support - CORS proxy fallback for blocked assets - Plugin system for custom transformations - Straighten transforms (remove rotate/translate) - Selective element exclusion - Tight bounding box calculation ## Installation ### NP