# Gutter text color

**URL:** https://discuss.codemirror.net/t/gutter-text-color/3172
**Category:** Uncategorized
**Created:** [May 7, 2021, 6:11am UTC](https://discuss.codemirror.net/t/gutter-text-color/3172 "2021-05-07T06:11:34Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![xixixao](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/xixixao/32/1213_2.png) [@xixixao](https://discuss.codemirror.net/u/xixixao)
#### Post date: [May 7, 2021, 6:11am UTC](https://discuss.codemirror.net/t/gutter-text-color/3172/1 "2021-05-07T06:11:34Z")

</div>

**Please ignore: This was caused by a browser extension.**

There is some magic going on when setting the `color` CSS property for gutter. Whatever I set the property to, and no matter what classes I use (`.cm-gutters`, `.cm-gutters .cm-gutter .cm-gutterElement`) the color gets always overridden. When I set it to “red”, the gutter does end up with an off-red color. But what I want to achieve, a lower contrast darker gutter, seems to be impossible.

Example of what I want to achieve:  
 ![Screen Shot 2021-05-06 at 23.03.02](https://discuss.codemirror.net/uploads/default/original/2X/b/b71973585a1b70c916a1ec3609776e2ff3996d5b.png)

Let me know if I should provide a better repro. I’m on EditorView 0.18.9.

```auto
EditorView.theme(
  {
    ".cm-gutters": {
      color: "#444",
    },
)
```

---

<div class="post-metadata">

### Author: ![marijn](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/marijn/32/136_2.png) [@marijn](https://discuss.codemirror.net/u/marijn)
#### Post date: [May 7, 2021, 8:20am UTC](https://discuss.codemirror.net/t/gutter-text-color/3172/2 "2021-05-07T08:20:24Z")

</div>

Doing something like that seems to work for me. So a full (but minimal) example might help figure out what’s going on.

---

<div class="post-metadata">

### Author: ![xixixao](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/xixixao/32/1213_2.png) [@xixixao](https://discuss.codemirror.net/u/xixixao)
#### Post date: [May 7, 2021, 2:28pm UTC](https://discuss.codemirror.net/t/gutter-text-color/3172/3 "2021-05-07T14:28:18Z")

</div>

Let me know if this doesn’t work:

> **[codemirror-example (forked) - CodeSandbox](https://codesandbox.io/s/codemirror-example-forked-du42u?file=%2Fmain.js)**
>
> codemirror-example (forked) using @codemirror/basic-setup, codemirror

Here are some screenshots from my actual instance (not the minimal repro):

 ![Screen Shot 2021-05-06 at 22.59.19](https://discuss.codemirror.net/uploads/default/original/2X/8/86204bb1d27cc6a51136500f35f559ecd0f7991e.png) ![Screen Shot 2021-05-06 at 22.59.35](https://discuss.codemirror.net/uploads/default/original/2X/6/6fe509ff9b0d20b08a690746480c26cbe2bba742.png) ![Screen Shot 2021-05-06 at 22.59.45](https://discuss.codemirror.net/uploads/default/original/2X/f/fc9614351e2cb25f7d01f980c905e48d0aae115f.png) ![Screen Shot 2021-05-06 at 23.01.54](https://discuss.codemirror.net/uploads/default/original/2X/1/19ec5e8044a4cd49405d0e5853d8ff7f9cdf5981.png) ![Screen Shot 2021-05-06 at 23.02.03](https://discuss.codemirror.net/uploads/default/original/2X/b/b0b3f09b7f96b9259bcdffeb740f2050815ddecc.png) ![Screen Shot 2021-05-06 at 23.02.18](https://discuss.codemirror.net/uploads/default/original/2X/7/791473715c912224c6ee9c9850b5624c42189760.png)

---

<div class="post-metadata">

### Author: ![xixixao](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/xixixao/32/1213_2.png) [@xixixao](https://discuss.codemirror.net/u/xixixao)
#### Post date: [May 7, 2021, 2:30pm UTC](https://discuss.codemirror.net/t/gutter-text-color/3172/4 "2021-05-07T14:30:09Z")

</div>

Actually sorry for the noise, this was caused by a browser extension. Not related to CodeMirror.