Code tool

HTML/CSS Preview

Compare responsive layout at adjustable mobile and desktop widths using an isolated sandboxed iframe.

In-browser processingNo account requiredPrivacy details ↗

Scripts are removed and never run. The preview uses a sandboxed iframe without allow-scripts. This is a layout preview only; it does not emulate a native device, DPR, or exact real-browser behavior.

Preview

Mobile

Desktop

A QUICK WALKTHROUGH

How to use this tool

  1. Paste HTML and CSS into the separate editors.
  2. Adjust the mobile and desktop viewport widths.
  3. Inspect both previews and remember that this is a layout approximation, not a native-device or DPR emulator.

Scripts never execute

Script elements and inline event-handler attributes are removed before source is placed in srcdoc. Each preview iframe has sandbox="" and does not include allow-scripts, so pasted JavaScript cannot run.

Viewport widths are adjustable

Set independent pixel widths for the mobile and desktop frames. The frames show layout at those CSS viewport widths while remaining inside the current browser window.

Clear limits

This tool previews HTML and CSS layout only. It does not emulate native device controls, device-pixel ratio, touch hardware, browser chrome, or exact rendering behavior across real browsers.

GOOD TO KNOW

Common questions

Can pasted JavaScript run?

No. Script elements and inline event handlers are removed, and the sandboxed iframes omit allow-scripts.

Does this simulate a phone or tablet?

No. It changes the CSS viewport width only. Native controls, DPR, touch input, and browser-specific behavior are not simulated.

Is my code uploaded?

The page does not upload your code; it assembles the preview locally. External URLs in your HTML or CSS can still request resources.