Custom CSS and Markdoc partials

Two settings let you tailor your API Portal beyond the theme: Custom css restyles the portal with your own CSS, and Markdoc Partials let you reuse content blocks across products. Both are entitlement-gated, so they appear only on plans that include them. For the rest of the portal surface, see the API Portal overview.

How do you add custom CSS to your API Portal?

Open Settings, then Portal Settings, then Custom css. Edit the CSS in the in-page editor or upload a .css file, then choose Save changes. The editor validates your CSS as you type and surfaces any errors below it.

1. Open Settings, then Portal Settings, then Custom css.
2. Write your CSS in the editor, or use Upload to load a .css file into it.
3. Fix any validation errors shown under the editor. The save button stays disabled while there are errors.
4. Choose Save changes. The button enables once the CSS changes and has no errors.

How do you target portal elements in custom CSS?

Portal elements carry class names prefixed with portal-. Write your rules against those classes to restyle the matching parts of the portal. The class names are stable, so you target a part of the portal without depending on its markup.

Which CSS variables can you override?

The portal reads its colours from CSS variables prefixed with --portal-. Override them in your custom CSS to recolour the portal without targeting individual elements. Changing a variable updates every element that uses it.

Override variables on :root, and target classes for finer control. This example recolours the brand and rounds the cards:

:root {
  --portal-brand-color-primary: #5200ff;
  --portal-link-color: #5200ff;
}

.portal-card {
  border-radius: 12px;
}

What are Markdoc partials?

Markdoc partials are reusable content templates you write once and use across products. You edit them in Settings, Portal Settings, Markdoc Partials, where a live preview renders next to the editor as you type.

A partial has a name and Markdoc content. Any $variable you write in the content becomes a variable on the partial, so a product can fill in its own values. Variables that start with $product. are reserved and are not treated as partial variables.

How do you create and edit a Markdoc partial?

In Markdoc Partials, choose a partial from the Select Partial Template dropdown to edit it, or use Add New to create one. Edit the Markdoc in the editor, watch the Preview update, then choose Save changes.

Is customization available on every plan?

No. Both settings are entitlement-gated, and they behave differently when off. Custom css shows a message and a sales link. Markdoc Partials is hidden from the Portal Settings menu entirely.

Where to next