Home

Arc Theme

Alexander Liu

Alexander Liu

Arc is a customizable Chromium based browser created by The Browser Company.

Arc browser theme selector.

Theme color variables for each space are injected into every tab via CSS variables. This allows sites to be customized through what Arc calls "Boosts". However, since colors are injected on every site, it also opens the opportunity to match a site to the user's theme.

As an aside, does this not make Arc users uniquely vulnerable to being fingerprinted?

Arc color palette demo site at https://arc.net/colors.html.

Caching

Arc only injects the color palette variables after the page finishes loading. This means that var(--arc-palette-background) is momentary undefined as the page firsts loads. While css var does allow you to specify fallback values, this would just result in the flash being a different set of colors.

Addressing this would require the Arc colors to be rendered during SSR. Since the colors are not sent to the server by default, I store the values in a cookie when the arc theme is first selected.

Caveats

If a user visits on two different spaces with different themes, they may see flashes of the other color as Arc is still populating the correct values.

Bugs

Arc provides both dark and light version of the palette. However, in my testing, it is determined the system color theme when the browser is launched. This sounds like unexpected behavior to me.

lowercase mode is enabled! /unlowercase
Copyright © 2024 Alexander Liu