Safari DevTools MCP

Check the currently active color scheme preference (light or dark) as seen by the page, and whether an MCP override is active.

Get computed CSS styles for an element by its UID from a snapshot. Returns commonly useful properties by default, or specify exact properties.

Gets a console message by its ID. You can get all messages by calling list_console_messages.

Get browser cookies for the current page. Optionally filter by name or domain.

Get the full HTML source of the current page.

Gets a network request by its reqid from the listed requests.

Get the page title, URL, and visible text content.

Read the current CSS safe-area-inset values (top, right, bottom, left) as seen by the page. These are non-zero on notched iPhones when viewport-fit=cover is set. Also checks whether the page uses env(safe-area-inset-*) in its stylesheets.

Read from localStorage or sessionStorage. Returns all entries or a specific key.

If a browser dialog was opened, use this command to handle it.

Hover over the provided element.

Parse the viewport meta tag and validate it against iOS Safari best practices. Reports issues like missing width=device-width, disabled zoom (accessibility violation), missing viewport-fit=cover for safe areas, and other common misconfiguration.

List all console messages for the currently selected page since the last navigation.

List all network requests for the currently selected page since the last navigation. Includes historical requests made before monitoring started (with limited detail).

Get a list of pages (tabs) open in Safari.

Go to a URL, or back, forward, or reload.

Open a new tab and load a URL.

Press a key or key combination. Use this when other input methods like fill() cannot be used.

Remove all device emulation overrides and restore the original viewport size, JS-level user agent, device pixel ratio, and touch settings.

Resizes the selected page's window so that the page has specified dimensions.

Right-click (context click) on the provided element.

Scroll the page in a direction by a given amount of pixels.

Scroll an element into view by its UID from a snapshot.

Select an option from a <select> dropdown by value or visible label.

Select a page as context for future tool calls.

Emulate prefers-color-scheme (light/dark mode) in the current page. Overrides CSS @media rules, the color-scheme property, and JavaScript matchMedia() (including change events) so the page behaves as if the OS preference changed. Use "reset" to restore the system default.

Set a browser cookie with the given name, value, and optional attributes.

Description is built at runtime.

Write a key-value pair to localStorage or sessionStorage.

Take a screenshot of the page or element.

Take a text snapshot of the currently selected page based on the DOM/a11y tree. The snapshot lists page elements along with a unique identifier (uid). Always use the latest snapshot. Prefer taking a snapshot over taking a screenshot.

Type text using keyboard into a previously focused input.

Upload a file through a provided file input element.

Wait for a condition on the page: text content, a CSS selector, or a JS predicate. Returns a snapshot once the condition is met. At least one condition (text, selector, or predicate) must be provided.