☰

Notion Custom Font

Change Notion Default Font

  1. // ==UserScript==
  2. // @name        Notion Custom Font
  3. // @namespace   Violentmonkey Scripts
  4. // @match       *://www.notion.so/*
  5. // @grant       none
  6. // @version     1.0
  7. // @author      reonokiy
  8. // @description Change Notion Default Font
  9. // @license MIT
  10. // ==/UserScript==
  11.  
  12. (function() {
  13.     'use strict';
  14.  
  15.    // 更改为想要的字体
  16.     const sansSerifFont = 'ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI Variable Display", "Segoe UI", Helvetica, "PingFang SC", "思源黑体", "Microsoft YaHei", Helvetica, "Apple Color Emoji", Arial, sans-serif, "Segoe UI Emoji", "Segoe UI Symbol"';
  17.     const serifFont = ' Lyon-Text, Georgia, "Songti SC", "思源宋体", serif';
  18.     const monoFont = ' iawriter-mono, Nitti, Menlo, Courier, "思源等宽", monospace';
  19.  
  20.     const style = document.createElement('style');
  21.     style.textContent = `
  22.         .notion-app-inner {
  23.             font-family: ${sansSerifFont} !important;
  24.         }
  25.  
  26.         .notion-app-inner [style*="serif"] {
  27.             font-family: ${serifFont} !important;
  28.         }
  29.  
  30.         .notion-app-inner [style*="monospace"] {
  31.             font-family: ${monoFont} !important;
  32.         }
  33.     `;
  34.  
  35.     document.head.appendChild(style);
  36.  
  37.     const observer = new MutationObserver(() => {
  38.         document.querySelectorAll('.notion-app-inner').forEach(el => {
  39.             el.style.fontFamily = sansSerifFont;
  40.         });
  41.     });
  42.  
  43.     observer.observe(document.body, {
  44.         childList: true,
  45.         subtree: true
  46.     });
  47.  
  48. })();