mcp-uimax

Instructions

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);