CSS Inspector

Live CSS Inspector & Editor Read and edit any website's CSS, live

Inspect any element, see its CSS values, and edit them live on the page - colors, fonts, spacing, shadows, anything.

Free to install · 3-day Pro trial · No card

CSS Inspector in action, recorded on a live website.

How it works

See any element's CSS, then change it live

1

Hover any element

Turn on Inspect and hover: MiroMiro outlines the element and shows what it is.

2

Read and edit its styles

See only the CSS that matters, and change any value live on the page.

3

Copy it as CSS or Tailwind

Take the values you tweaked into your project in one click.

What you get

DevTools, without the digging

Read

Only the CSS that matters

Hover any element to see its fonts, colors, spacing and shadows. No DOM tree, no cascade to untangle.

Edit

Change it live on the page

Tweak any value and the page updates as you type. The live site stays untouched for everyone else.

States

Hover and focus too

See the styles an element gets when you hover or focus it, not only its resting state.

Copy

Take it as CSS or Tailwind

Copy the values you tweaked straight into your project, in one click.

What is the CSS inspector?

MiroMiroのライブCSSインスペクターは、あらゆるWebサイトをサンドボックスに変えます。要素にホバーするだけで、カラー、フォント、スペーシング、ボーダー、シャドウ、グラデーションなど完全なCSSを即座に確認。値をその場で編集すると、ページがリアルタイムに更新されます。ボタンのパディング調整、ヒーローのカラー変更、フォントウェイトの増減、カード全体のリスタイルも可能。デザインが決まったら、編集後の値をクリーンなCSSまたはTailwindとしてワンクリックでコピーし、そのままコードベースに貼り付けられます。リロードすると編集が消えるChrome DevToolsや、読み取り専用のCSS Peeperとは異なり、MiroMiroはライブ編集・リアルタイムプレビュー・ワンクリックコードエクスポートを1つの拡張機能に統合しています。

FAQ

CSS inspector questions

Try the CSS inspector on any website

Install MiroMiro free. Full Pro for 3 days, no card needed.