SnapDOM vs html2canvas
Capture the same element to canvas five times with each library and compare the average time in this browser.
SnapDOM vs html2canvas SnapDOM vs dom-to-image
Basic capture
Hello SnapDOM!
Transforms & shadows
Capture it just with outerTransforms /
outerShadows.
Animated transition
I'm dancing and changing color!
Orbit CSS toolkit - Go to repo
HTML export Plugin
The html-export plugin returns a self-contained HTML snapshot with styles, fonts and images inlined. The preview opens that document in a sandboxed <iframe>.
Provisioning manifest
A surface with varied controls and a pseudo-element dot.
SHF · 2.4 GHzGIF recording Plugin
The gif-export plugin records the live element frame by frame and returns an animated GIF. Recording starts when you call toGif().
Video recording Plugin
The video-export plugin records the live element using MediaRecorder. The browser selects a supported MP4 or WebM format; check Blob.type for the result.
Video frame Core
Capture the current frame of a <video> along with its surrounding interface. Press play, then capture a frame. This demo uses a CORS-enabled sample video.
Web fonts
Unique Typography!
Web fonts with embedFonts: true.
Shadow DOM
Canvas
Export formats
PNG, JPG & WebP.
Pseudo-elements
Clip-path
Mix blend mode
CSS background-blend-mode: multiply. A gradient image (sky + grass) blended with a blue overlay. SnapDOM captures the final rendered result.