1# 🎨 cerium.js - one stylesheet23cerium.js is the single stylesheet for nobel's visual presets. It adds one `<style>` to the page with quiet defaults for cards, chips, avatars and notes, all inside `@layer nobel` and `:where()`, so any rule of yours wins without `!important`. Presets never style themselves, so turning cerium off leaves plain, semantic HTML.45```html6<script src="cerium.js"></script>7<style>:root { --n-accent:#c2410c; --n-radius:4px; }</style>8```910That themes every preset on the page through custom properties, in light and dark.1112## Custom properties1314Set them on `:root` or any ancestor. Dark values apply under `prefers-color-scheme: dark`.1516| property | light | dark | used for |17|---|---|---|---|18| `--n-fg` | `#1c1c1f` | `#ececf1` | text |19| `--n-bg` | `#fff` | `#17171a` | card background |20| `--n-muted` | `#6d6d75` | `#9a9aa3` | NIP-05, times, copy buttons |21| `--n-accent` | `#5b4fc4` | `#a99cff` | links, verified mark, copied state |22| `--n-line` | `#e2e2e7` | `#2e2e34` | hairline borders, avatar placeholder |23| `--n-radius` | `.75rem` | | card corners |24| `--n-avatar` | `3rem` | | avatar size (chips use `1.4em`) |25| `--n-font` | unset | | font family (the page's font when unset) |2627## Parts2829Every lanthanide marks what it generates with a part attribute in its own prefix, `[n??-part=name]`, and cerium is the one place that styles them. New lanthanides add their rules here, as `:where()` selectors inside the layer.3031| library | host | parts |32|---|---|---|33| praseodymium | `[npr-card]`, `[npr-chip]`, `img[npr-avatar]` | `avatar`, `name`, `nip05`, `about`, `copy`, plus `[npr-copied]` and radon's `[nrn-verified]` |34| europium | `[neu-note]` | `author`, `avatar`, `name`, `time`, `content`, `link` |3536## Opting out3738| option | description |39|---|---|40| `nce-bare` on `<html>` | skip the stylesheet |41| `window.nceCfg = {bare:true}` | same, from script |42| `cerium.css` | the CSS text, to copy into your own stylesheet |43| `cerium.style` | the injected `<style nce-style>`, or `null` |