Free Dark Mode Preview Tool

See how any website looks in dark mode vs light mode — side by side. Test prefers-color-scheme support instantly.

☀️ Light Mode

Light mode preview

Capturing light mode…

Light mode screenshot
🌙 Dark Mode

Dark mode preview

Capturing dark mode…

Dark mode screenshot

Test Dark Mode Support on Any Website

Dark mode has become a must-have feature. Over 80% of users prefer dark mode, and it's a key accessibility feature for reducing eye strain. Our tool captures real screenshots with prefers-color-scheme: dark enabled, so you can see exactly how websites respond to the dark mode media query.

🌗 Side-by-Side Comparison

See light and dark mode next to each other for easy visual comparison.

🎯 Real Media Query

Uses the actual prefers-color-scheme: dark media query, just like your OS settings.

📸 Real Screenshots

Headless Chromium captures, not simulated CSS filters or color inversions.

📥 Download Both

Download light and dark mode screenshots separately to share with your team.

Need More? Get 200 Free Screenshots/Month

Automate dark mode testing with the SnapAPI REST API. Pass dark_mode=true to any screenshot request.

Frequently Asked Questions

How does dark mode preview work?

We capture two screenshots: one with default settings (light mode) and one with prefers-color-scheme: dark emulated in the browser.

What if the site doesn't support dark mode?

Both screenshots will look the same — the site simply doesn't respond to the dark mode media query. This is useful for testing whether dark mode has been implemented.

Is this tool free?

Yes! Completely free. For API access and automated testing, sign up for a free account with 200 screenshots/month.

Can I use this via API?

Yes. Add dark_mode=true to any SnapAPI screenshot request. See the docs.

More free tools: Screenshot Tool · Responsive Checker · Full Page Screenshot · All Tools