> * [Primer colours](https://primer.style/foundations/color/base-scales) to use:
>
> * **Background info line:** base-color-orange-1
>
> * **Background body**: base-color-orange-0
>
> * **Stroke info line**: base-color-orange-1
>
> * **Stroke body**: base-color-orange-1
>
> * These colours will automatically adjust to dark mode (Primer feature)
>
>
> FIGMA: [https://www.figma.com/design/w0YoqQ5v0JGNT5NS5NZJZq/Comments-with-restricted-visibility?node-id=3-6110&t=4Cj4fssoj258fqBb-0](https://www.figma.com/design/w0YoqQ5v0JGNT5NS5NZJZq/Comments-with-restricted-visibility?node-id=3-6110&t=4Cj4fssoj258fqBb-0)

<br>

The colors proposed on this design are not defined by primer currently in the background presets (i.e. bg: primer system argument) [https://primer.style/foundations/primitives/color#background](https://primer.style/foundations/primitives/color#background) Hence it&#39;s likely we would need to introduce our own following primer. See [https://primer.style/foundations/primitives/token-names](https://primer.style/foundations/primitives/token-names)

<br>

\---

Henriette: We cannot introduce any new system arguments as they are controlled by Primer, we are okay to use base color variables as the use is localized. Begin of the insertion

\--

**UX Proposal (Parimal):**

Three options:

<img class="op-uc-image op-uc-image_inline" src="/api/v3/attachments/340275/content">

<figure class="table op-uc-figure_align-center op-uc-figure"><table class="op-uc-table"><tbody><tr class="op-uc-table--row"><td class="op-uc-table--cell"><p class="op-uc-p"><strong>Colour option</strong></p></td><td class="op-uc-table--cell"><p class="op-uc-p"><strong>A</strong></p></td><td class="op-uc-table--cell"><p class="op-uc-p"><strong>B</strong></p></td><td class="op-uc-table--cell"><p class="op-uc-p"><strong>C</strong></p></td></tr><tr class="op-uc-table--row"><td class="op-uc-table--cell"><p class="op-uc-p">Primer variables</p></td><td class="op-uc-table--cell"><p class="op-uc-p">Info line background: <code class="op-uc-code">--data-auburn-color-muted</code><br>Comment body background: <code class="op-uc-code">--bgColor-severe-muted</code><br>Info/comment body stroke: <code class="op-uc-code">--borderColor-attention-emphasis</code></p></td><td class="op-uc-table--cell"><p class="op-uc-p">Info line background: <code class="op-uc-code">--bgColor-severe-muted</code><br>Comment body background: <code class="op-uc-code">none</code><br>Info/comment body stroke: <code class="op-uc-code">--borderColor-attention-emphasis</code></p></td><td class="op-uc-table--cell"><p class="op-uc-p">Info line background: <code class="op-uc-code">---bgColor-inset</code><br>Comment body background: none<br>Info/comment body stroke: <code class="op-uc-code">--borderColor-attention-emphasis</code></p></td></tr><tr class="op-uc-table--row"><td class="op-uc-table--cell"><p class="op-uc-p">Remarks</p></td><td class="op-uc-table--cell"><p class="op-uc-p">The comments is easily distinguisable as being different, although the colours are still quite subtle</p></td><td class="op-uc-table--cell"><p class="op-uc-p">Still quite distinguishable as different, slightly brighter, less-subtle colour on just the info bar. Is it sufficiently different?</p></td><td class="op-uc-table--cell"><p class="op-uc-p">This only <i>only</i> changes stroke colour, but I had to use a darker/higher-emphasis one else it's too subtle. Without a fill, I don't think it's suficiently distinguisable.</p></td></tr></tbody></table></figure>End of the insertion