> For the complete documentation index, see [llms.txt](https://docs.planetstyles.net/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.planetstyles.net/feature-guides/group-post-highlight/creating-and-managing-highlight-styles.md).

# Creating & Managing Highlight Styles

Highlight styles are managed in ACP under **Extensions → Group Post Highlight → Highlight Styles**. A style isn't tied to any post directly; it's a reusable definition that gets assigned to one or more groups (see Assigning a style to a group). Editing a style updates every group, and every post, using it immediately.

### The style list

Each row shows a live swatch preview, the style's name, how many groups currently use it, and actions:

| Action        | What it does                                                                                           |
| ------------- | ------------------------------------------------------------------------------------------------------ |
| **Edit**      | Open the visual editor for that style.                                                                 |
| **Duplicate** | Create a copy named "*Style name* (copy)", then jump straight to editing it.                           |
| **Delete**    | Remove the style. Blocked while any group still has it assigned; reassign or clear those groups first. |

### The visual editor

The editor is split into three parts: a live preview, the visual style fields, and custom CSS.

{% hint style="info" %}
Every colour field is optional. Leave a swatch blank to skip that part of the style entirely; for example, no border colour means no border is drawn, rather than falling back to a default colour.
{% endhint %}

#### Border, background & text

| Field                                | Notes                                                                                                                                                                     |
| ------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Border colour / opacity              | Blank = no border.                                                                                                                                                        |
| Border width (top/right/bottom/left) | Set independently per edge, 0–50px.                                                                                                                                       |
| Background colour / opacity          | Blank = theme's default post background shows through.                                                                                                                    |
| Text colour                          | Blank = the theme's normal post text colour. Unlike border/background this has no separate opacity slider; it's either the picked colour at full strength, or left alone. |

#### Shadow

Border, background and shadow colours are each built from a hex colour plus a separate 0–100% opacity slider, rather than an alpha channel baked into the hex value.

| Field                   | Notes                                                          |
| ----------------------- | -------------------------------------------------------------- |
| Shadow colour / opacity | Blank = no shadow.                                             |
| Offset X / Y            | Horizontal / vertical shadow position, -50 to 50px.            |
| Blur / Spread           | 0–50px blur, -50 to 50px spread.                               |
| Inset                   | Draws the shadow inside the post border instead of outside it. |

#### Badge

A small pill shown under the post title.

| Field                  | Notes                                                                                                                                                                                                |
| ---------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Show badge             | Master toggle for the badge.                                                                                                                                                                         |
| Badge label            | Free text, up to 40 characters (e.g. "Admin", "Moderator", "Community Helper"). **Left blank, no badge is shown even with the toggle on** (this is re-checked at render time, not just when saving). |
| Badge colour / opacity | Background colour of the pill.                                                                                                                                                                       |
| Show icon              | Adds an icon before the label.                                                                                                                                                                       |
| Icon                   | Searchable picker of icons; type to filter by name.                                                                                                                                                  |

{% hint style="warning" %}
**The badge only renders in the topic view (viewtopic), not on search results.** A highlighted post's border/background still shows correctly everywhere it's opted in, including search results and "Search user's posts", but prosilver's search results template has no template event positioned where the badge needs to render, so it's left off there rather than placed somewhere visually wrong. See Custom & per-theme CSS for the exact wrapper markup this depends on.
{% endhint %}

The preview panel at the top of the page updates live as you edit any of these fields, so you can see the result before saving.

### Custom CSS

Below the visual editor is a **Global CSS** box for admin-authored CSS layered on top of the generated style. See Custom & per-theme CSS for the selectors to use and how per-theme overrides work.