☰

Wplace Dark Mode

8/15/2025, 4:49:32 AM

// ==UserScript==
// @name        Wplace Dark Mode
// @namespace   Violentmonkey Scripts
// @match       https://wplace.live/*
// @grant       GM_addStyle
// @grant       unsafeWindow
// @version     1.0
// @author      Dylan Dang
// @description 8/15/2025, 4:49:32 AM
// @run-at document-start
// @license MIT
// ==/UserScript==


const originalFetch = window.fetch;
const root = unsafeWindow || window;
root.fetch = async (req, options) => {
  const res = await originalFetch(req, options);
  if (res.url !== 'https://maps.wplace.live/styles/liberty') return res;
  const json = await res.json();
  json.layers.forEach(layer => {
    
    if (layer.id === 'background') {
      layer.paint['background-color'] = '#272e40';
    }

    if (layer.id === 'water') {
      layer.paint['fill-color'] = '#000d2a';
    }

    if (layer.id === 'natural_earth') {
      layer.paint['raster-brightness-max'] = 0.4;
    }

    if (layer.id === 'landcover_ice') {
      layer.paint['fill-color'] = '#475677';
    }

    if (layer.id === 'road_minor') {
      layer.paint['line-color'] = '#3b4d65';
    }
    if (layer.id === 'park') {
      layer.paint = {
        "fill-color": "#0e4957",
        "fill-opacity": 0.7
      }
    }
    if (layer.id === 'park_outline') {
      layer.paint['line-opacity'] = 0;
    }
    if (layer.id === 'waterway_line_label' || layer.id === 'water_name_point_label' || layer.id === 'water_name_line_label') {
      layer.paint['text-color'] = '#8bb6f8';
      layer.paint['text-halo-color'] = 'rgba(0,0,0,0.7)';
    }
    if (layer.id.startsWith('label') || layer.id === 'airport') {
      switch (layer.paint['text-color']) {
        case '#333':
          layer.paint['text-color'] = '#91a0b5';
          break;
        case '#000':
          layer.paint['text-color'] = '#e4e5e9';
          break;
      }
      layer.paint['text-halo-color'] = 'rgba(0,0,0,0.7)';
    }
    if (layer.id === 'tunnel_path_pedestrian' || layer.id === 'road_path_pedestrian') {
      layer.paint['line-color'] = '#90a2ac';
    }
  });
  const text = JSON.stringify(json)
    .replaceAll('#a0c8f0', '#000d2a') // waterways
    .replaceAll('#e9ac77', '#476889') // road
    .replaceAll('#fc8', '#476889') // primary roads
    .replaceAll('#fea', '#3d5b77') // secondary roads
    .replaceAll('#cfcdca', '#3b4d65') // casing
    .replaceAll('"#fff"', '"#e4e5e9"') // other stuff
  return new Response(text, {
    headers: res.headers,
    status: res.status,
    statusText: res.statusText,
  });
};


GM_addStyle(/* css */`
  :root {
    --color-base-100: #1b1e24;
    --color-base-200: #262b36;
    --color-base-300: #151922;
    --color-base-content: #f5f6f9;
    --noise: 0;
  }
  /* transparent color selector */
  #color-0 {
    background-color: white !important;
  }
`);