Codemirror vim mode search highlight

Hello, I wonder is there a way to change the highlight color for vim mode search highlight? I currently use manual inspection to change the color for this: .ͼi But manually changing it is too cumbersome. Is there a way to change it in css with tampermonkey. (the code mirror is embedded in

The classes with ͼ characters are not stable and you should definitely not use them in your CSS. To override that style, either use a CodeMirror theme, or target .cm-editor .cm-searchMatch. Is the duplicate class in your example just to add specificity? In principle, styles provided with <style> tags should automatically override CSS injected by CodeMirror, when they have the same specificity.

Thank you for your suggestion. I just need some tampermonkey script so that I can permanently change the theme of overleaf editor in vim-mode. I am not very familiar with css/html stuff so…

And I got it working:

// ==UserScript==
// @name         Overleaf vim search highlight
// @namespace
// @version      0.1
// @description  Override CSS on a specific website
// @author       Your Name
// @match*
// @grant        window.onurlchange
// ==/UserScript==

(function() {
    'use strict';
    console.log('Tampermonkey script is running');
    // Your custom CSS
    var customCSS = `
        .cm-editor .cm-searchMatch,
        .cm-editor .cm-selectionMatch {
            background: rgba(187, 212, 251, 0.9) !important;
            outline: 1px solid rgb(187, 212, 251) !important;
            margin: 0 !important;
        /* Add more CSS rules here */

    // Create a style element
    var style = document.createElement('style');
    style.type = 'text/css';

    // Append the style element to the head