# `GanttEx.Live.Styles`
[🔗](https://github.com/rocket4ce/gantt_ex/blob/v0.1.0/lib/gantt_ex/live/styles.ex#L1)

The GanttEx stylesheet, shipped as colocated CSS (see `GanttEx.ColocatedCSS`).

All classes are prefixed with `gx-` and every color, size and radius is a
CSS custom property defined on `.gx-root`, so themes can be customized
without touching the markup:

    .gx-root {
      --gx-accent: #0ea5e9;
      --gx-task: #0ea5e9;
      --gx-task-progress: #0369a1;
      --gx-radius: 4px;
    }

Dark mode is applied with `theme="dark"`, or automatically with
`theme="auto"` (the default) when the user prefers a dark color scheme or
an ancestor has `data-theme="dark"`.

---

*Consult [api-reference.md](api-reference.md) for complete listing*