Retrail/Configuration

Configuration

Site details, theme and footer options in settings.json.

Retrail is set up in settings.json in its folder. The file is read on the server on every request, so a saved change shows on the next refresh. Visitors never see the file.

settings.json

{
  "site": {
    "title": "Example Portfolio",
    "description": "Projects, skills and contact details.",
    "favicon": "/favicon.ico",
    "logo": ""
  },
  "theme": {
    "primaryColor": "neon-cyan",
    "defaultColorScheme": "dark",
    "radius": "sm",
    "containerSize": "md"
  },
  "footer": {
    "enabled": true,
    "text": "%sitename% • Made with Retrail",
    "links": [{ "label": "GitHub", "url": "https://github.com", "enabled": true }]
  },
  "blocks": []
}

blocks is the page itself. See the Page Builder.

site

Option	What it does
`title`	The browser tab title, and the name used in link previews.
`description`	The description used by search engines and link previews.
`favicon`	The browser tab icon, as a full URL or a file in `public/`.
`logo`	Reserved. Not shown yet.

theme

Option	Default	What it does
`primaryColor`	`neon-cyan`	The accent colour for buttons, badges and highlights.
`defaultColorScheme`	`dark`	`dark`, `light` or `auto` to follow the visitor's device. Visitors can switch with the toggle in the footer.
`radius`	`sm`	Corner roundness: `xs`, `sm`, `md`, `lg` or `xl`.
`containerSize`	`md`	How wide the page gets: `xs`, `sm`, `md`, `lg` or `xl`.

primaryColor takes any Mantine colour, such as blue, teal, violet or orange, or one of Retrail's four neon colours:

Colour	Hex
`neon-cyan`	`#00f0ff`
`neon-green`	`#00ff88`
`neon-purple`	`#9933ff`
`neon-pink`	`#ff007f`

Dark mode uses a true black background.

footer

Option	What it does
`enabled`	Set to `false` to hide the footer.
`text`	The footer line.
`links`	Links on the right, each with a `label`, `url` and optional `enabled`.

Placeholder	Becomes
`%sitename%`	`site.title`.
`%year%`	The current year.

PreviousSetup Guide NextPage Builder