Chaotic fonts

Apply extreme chaos to every letter with unpredictable fonts, sizes, transformations, and more!

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         Chaotic fonts
// @namespace    http://tampermonkey.net/
// @version      69,420
// @description  Apply extreme chaos to every letter with unpredictable fonts, sizes, transformations, and more!
// @author       You
// @match        *://*/*
// @grant        none
// @license MIT
// ==/UserScript==

(function () {
    'use strict';

    const fonts = [
        'Impact', 'Comic Sans MS', 'Papyrus', 'Courier New', 'Arial', 'Verdana', 'Brush Script MT',
        'Lobster', 'Rock Salt', 'Fugaz One', 'Roboto Mono', 'Zilla Slab', 'Bangers', 'Press Start 2P',
        'Orbitron', 'Anton', 'Bebas Neue', 'Permanent Marker', 'Pacifico', 'Exo', 'Inconsolata', 'Lora',
        'Fira Code', 'Fredericka the Great', 'Teko', 'Caveat', 'Sacramento', 'Indie Flower', 'Satisfy',
        'Bungee', 'Quicksand', 'Bevan', 'Rochester', 'Gloria Hallelujah', 'Oswald', 'Bitter', 'Muli',
        'Dancing Script', 'Merriweather', 'Cinzel', 'Shadows Into Light', 'Exo 2', 'Slabo 27px',
        'Raleway', 'Bree Serif', 'Russo One', 'Saira Condensed', 'Playfair Display', 'Crimson Pro', 'Arvo',
        'Chivo', 'Darker Grotesque', 'Yeseva One', 'Fira Sans', 'Roboto Slab', 'Gloock', 'Pangolin',
        'Special Elite', 'Patrick Hand', 'Audiowide', 'Bangers', 'Lobster', 'Darker Grotesque', 'Gloock',
        'Lobster Two', 'Staatliches', 'Pangolin', 'Roboto Slab', 'Coda Caption', 'Alegreya', 'Kaushan Script',
        'Mochiy Pop P One', 'Charmonman', 'Pattaya', 'Nunito', 'Tribal', 'Unkempt', 'Wildscript', 'Funky',
        'Heavy Blurred', 'Cursive Sans', 'Unstoppable', 'Caveat Brush', 'Creepster', 'Bad Script', 'Cherry Swash',
        'Kalam', 'Shadows Into Light', 'Vast Shadow', 'Rock Salt', 'Zilla Slab Highlight', 'Reenie Beanie',
        'Slackey', 'Cherry Swash', 'Creepster', 'Reenie Beanie', 'Rock Salt', 'Slackey', 'Audiowide', 'Bangers',
        'Lobster', 'Fira Sans', 'Quicksand', 'Lobster Two', 'Signika', 'Amatic SC', 'Zilla Slab', 'Muli'
    ];

    function getRandomFont() {
        return fonts[Math.floor(Math.random() * fonts.length)];
    }

    function getRandomSize() {
        return Math.floor(Math.random() * 29 + 12) + 'px'; // Random size from 12px to 40px
    }

    function getRandomRotation() {
        // Limiting rotation to be between -45 and 45 degrees
        return Math.floor(Math.random() * 91) - 45 + 'deg'; // Random rotation between -45deg and 45deg
    }

    function getRandomSpacing() {
        return (Math.random() * 5 - 2) + 'px'; // Random letter-spacing from -2px to 3px
    }

    function getRandomTextShadow() {
        const offsetX = Math.floor(Math.random() * 10 - 5);
        const offsetY = Math.floor(Math.random() * 10 - 5);
        const blur = Math.floor(Math.random() * 10);
        const color = `rgba(${Math.floor(Math.random() * 256)}, ${Math.floor(Math.random() * 256)}, ${Math.floor(Math.random() * 256)}, 0.7)`;
        return `${offsetX}px ${offsetY}px ${blur}px ${color}`;
    }

    // Function to apply random chaotic styles to the text node
    function applyRandomStyles(node) {
        if (node.nodeType === 3) { // Text node
            let parent = node.parentNode;

            // Avoid modifying elements where changes may break functionality (like <style>, <script>, etc.)
            if (['STYLE', 'SCRIPT', 'IFRAME', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'BUTTON', 'SELECT'].includes(parent.tagName)) {
                return;
            }

            let text = node.nodeValue.trim();
            if (text.length === 0) return;

            let newHtml = '';
            for (let char of text) {
                if (char.trim()) { // Skip spaces
                    newHtml += `<span style="font-family: ${getRandomFont()};
                                            font-size: ${getRandomSize()};
                                            transform: rotate(${getRandomRotation()});
                                            letter-spacing: ${getRandomSpacing()};
                                            text-shadow: ${getRandomTextShadow()};
                                            display: inline-block;">
                                    ${char}</span>`;
                } else {
                    newHtml += char; // Keep spaces unchanged
                }
            }

            let span = document.createElement('span');
            span.innerHTML = newHtml;
            parent.replaceChild(span, node);
        } else if (node.nodeType === 1) { // Element node
            Array.from(node.childNodes).forEach(applyRandomStyles);
        }
    }

    // Apply random chaotic styles to the entire document body
    applyRandomStyles(document.body);
})();