check_dark_mode
Detect dark mode support on webpages by comparing light and dark screenshots to verify proper implementation and calculate visual differences.
Instructions
Detect whether a webpage supports dark mode. Captures two screenshots — one in light mode and one with prefers-color-scheme: dark emulated — then compares them. Returns both screenshots and a difference percentage. Great for checking if dark mode is properly implemented.
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to check |
Implementation Reference
- src/tools/dark-mode.ts:119-136 (handler)The main handler function `checkDarkMode` that performs the logic of capturing light and dark mode screenshots and comparing them.
export async function checkDarkMode(url: string): Promise<DarkModeResult> { const lightBase64 = await captureLightScreenshot(url); const darkBase64 = await captureDarkScreenshot(url); const differencePercent = calculateBase64DifferencePercent( lightBase64, darkBase64 ); return { hasDarkMode: differencePercent > 0, differencePercent, lightScreenshot: { base64: lightBase64, mimeType: "image/png" }, darkScreenshot: { base64: darkBase64, mimeType: "image/png" }, url, timestamp: new Date().toISOString(), }; } - src/tools/dark-mode.ts:10-17 (schema)Type definition for the result returned by `checkDarkMode`.
export interface DarkModeResult { readonly hasDarkMode: boolean; readonly differencePercent: number; readonly lightScreenshot: DarkModeScreenshot; readonly darkScreenshot: DarkModeScreenshot; readonly url: string; readonly timestamp: string; } - src/server.ts:352-360 (registration)Tool registration for `check_dark_mode` in `src/server.ts`.
server.tool( "check_dark_mode", "Detect whether a webpage supports dark mode. Captures two screenshots — one in light mode and one with prefers-color-scheme: dark emulated — then compares them. Returns both screenshots and a difference percentage. Great for checking if dark mode is properly implemented.", { url: z.string().url().describe("URL of the page to check"), }, async ({ url }) => { try { const result = await checkDarkMode(url);