Font Family Override

WHAT IT DOES

Font Family Override is a browser extension that allows you to override the font family of any webpage with a custom font or a preset selection. You can choose from a curated list of 20 common fonts including Arial, Helvetica, Georgia, Times New Roman, Courier New, Verdana, Tahoma, and many more, or enter a custom font name. The font is applied to all text elements on the page with a toggle to enable or disable the override. You can also adjust the font size from 8px to 40px. The settings are saved per website, so you can have different fonts for different sites. The tool includes a live preview showing the selected font and size, making it easy to see the effect before applying. The tool is ideal for users who prefer specific fonts for readability, accessibility, or personal preference.

WHERE IT RUNS

Font Family Override runs on any webpage, overlaying a floating panel that does not interfere with page content. It operates entirely in your browser as a lightweight userscript, injecting CSS to override font families. It works on any page, whether static or dynamic, with no external dependencies. All settings are stored locally using GM_setValue—no data is ever sent to any server.

HOW TO USE

After installation, open the floating panel by clicking the extension icon. The panel shows the current status (Enabled or Disabled) and a toggle button to enable or disable the font override. Use the "Font" dropdown to select a font from the list of presets, or enter a custom font name in the dropdown. Use the "Size" slider to adjust the font size from 8px to 40px. The live preview shows the selected font and size applied to sample text. Click the "Reset Default" button to restore the default font (Arial) and size (16px). Click the "Reapply" button to reapply the current font if it was removed by page changes. The font and size are saved per website, so your preferences persist across visits.

REAL MECHANISM — WHY THIS WORKS

Most font override tools rely on modifying the body's style property or using a user stylesheet, which can be overridden by the page's CSS or other scripts. Font Family Override uses a combination of high-specificity CSS rules and direct style injection to ensure the font is applied reliably. The tool injects a style element with !important rules that apply the selected font family and size to all elements using the universal selector (*). This approach ensures that the font is applied to all text elements regardless of the page's existing CSS. The tool also sets the body's font style directly as a fallback. When the toggle is disabled, the injected style element is removed and the body's font styles are cleared, restoring the page's original appearance. The font family and size are stored in GM_setValue and automatically reapplied on page load. The live preview updates in real time as you change the font or size, using the same CSS rules that will be applied to the page. This approach ensures consistent, reliable, and fully private font override without requiring any external services or network access.

THE PANEL

The floating panel is fully draggable and remembers its position per site, snapping to the edges of the viewport when dragged near them. You can collapse the panel to a small icon to minimize screen distraction and expand it back with a single click. The panel is resizable from the bottom-right corner, giving you more space to view font options. Press the Escape key to close the panel instantly. The panel remains open across page navigation within the same domain, maintaining your current view state. All preferences—panel position, font family, font size, and enabled state—are saved per domain for a seamless experience.

PLEASE NOTE

Font Family Override requires the free BotGentz extension to be installed and enabled, as it relies on the cross-extension messaging API provided by BotGentz for DOM access permissions. The tool applies fonts using CSS !important rules, which may conflict with page styles that also use !important. The font you select must be available on your system or loaded via @font-face; the tool does not automatically load web fonts. The custom font field accepts any font name but does not validate if the font exists. All settings are stored locally in your browser using GM_setValue. No page content, font data, or usage information is ever sent to any server. The extension does not read, store, or transmit any personal information. It only modifies CSS at your request.