claude.ai

Claude Neutral (Darker)

1 download

Screenshot of Claude Neutral (Darker) on claude.ai

About this boost

Removes the green and yellow tint from claude.ai's light and dark themes: neutral greys only. Darker backgrounds than Claude Neutral.

By Alexander Bays (@956MB). Imported from https://github.com/956MB/boosts under the MIT License.

What this boost changes

  • Custom CSS

    Adds 79 lines of its own CSS. Rules that would load files from the internet are rejected when a boost is submitted.

    ShowHide 79 lines · 2.6 KB
    /*
     * From https://github.com/956MB/boosts
     *
     * MIT License
     *
     * Copyright (c) 2026 Alexander Bays
     *
     * Permission is hereby granted, free of charge, to any person obtaining a copy
     * of this software and associated documentation files (the "Software"), to deal
     * in the Software without restriction, including without limitation the rights
     * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
     * copies of the Software, and to permit persons to whom the Software is
     * furnished to do so, subject to the following conditions:
     *
     * The above copyright notice and this permission notice shall be included in all
     * copies or substantial portions of the Software.
     *
     * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
     * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
     * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
     * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
     * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
     * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
     * SOFTWARE.
     */
    
    /* Claude Neutral (Darker) */
    /* https://github.com/956MB/boosts/blob/main/claude-neutral-darker.css */
    
    /* https://claude.ai/ */
    
    [data-mode="light"] {
    	color-scheme: light !important;
    	--text-000: 0 0% 5.5% !important;
    	--text-100: 0 0% 13.3% !important;
    	--text-200: 0 0% 20% !important;
    	--text-300: 0 0% 30% !important;
    	--text-400: 0 0% 37% !important;
    	--text-500: 0 0% 42.1% !important;
    	--bg-000: 0 0% 97.1% !important;
    	--bg-100: 0 0% 94.9% !important;
    	--bg-200: 0 0% 92% !important;
    	--bg-300: 0 0% 87.8% !important;
    	--bg-400: 0 0% 82% !important;
    	--bg-500: 0 0% 71% !important;
    }
    
    [data-mode="dark"] {
    	color-scheme: dark !important;
    	--text-000: 0 0% 97.1% !important;
    	--text-100: 0 0% 94.9% !important;
    	--text-200: 0 0% 89.2% !important;
    	--text-300: 0 0% 79% !important;
    	--text-400: 0 0% 69.2% !important;
    	--text-500: 0 0% 62.9% !important;
    	--bg-000: 0 0% 15.4% !important;
    	--bg-100: 0 0% 12.5% !important;
    	--bg-200: 0 0% 11.3% !important;
    	--bg-300: 0 0% 8.4% !important;
    	--bg-400: 0 0% 6.4% !important;
    	--bg-500: 0 0% 3.9% !important;
    }
    
    .prismjs.code-block__code,
    code[class*="language-"],
    .code-block__code[style*="background"],
    .code-block__code[style],
    .code-block__code[style] code,
    .code-block__code code[style],
    .code-block__code * {
    	background: #1d1d1d !important;
    	background-color: #1d1d1d !important;
    }
    
    span.token[style*="color: rgb(92, 99, 112)"][style*="font-style: italic"]:not(
    		[style*="font-weight:"]
    	) {
    	color: #666666 !important;
    }

Something wrong with this boost? Sign in to report it.