Skip to content

User Settings

Introduction

The User Settings panel allows you to manage your personal profile information and customize the Grails interface to your liking. Open it from anywhere in the platform with the user menu — your avatar, at the right end of the top bar — and choose Settings.

Overview

The user settings drawer is divided into two main tabs to help you organize your preferences:

  • Profile: Edit your personal information, such as your name and avatar.
  • Appearance: Toggle between different interface themes.

User Settings - Profile

Profile Tab

In the Profile tab, you can view and update your basic account information:

  • Name: Your display name visible to other team members across the platform.
  • Email: The email address associated with your account (view-only).
  • Avatar: Your profile picture. If not set, it will display the initials of your name.

Appearance Tab

The Appearance tab lets you customize how Grails looks on your device:

  • Light Mode: A bright, clean interface for well-lit environments.
  • Dark Mode: A dark, high-contrast interface to reduce eye strain in low-light environments.

User Settings - Appearance

Text size

Under Text size, choose how large text is across Grails:

  • Small: the default.
  • Medium: one step larger.
  • Large: two steps larger.

Body text is 12 px at Small, 13 px at Medium and 14 px at Large. Only the text grows, and the side panels with it, so the names in them keep their room: spacing stays the same. The choice applies to the browser you make it in, like the theme, and stays after you reload.

User Settings - Text size, Small, Medium or Large

Side panels

Docs, Components, Tokens, Styles and Typography have panels beside the page, and they all follow this setting. Under Side panels, choose how they sit:

  • Floating: each panel is a card over the edge of the page, as tall as what it holds.
  • Fixed: each panel is docked to the side of the page, at full height.

The choice applies to both panels at once and stays after you reload. This is the only place to make it: the panels have no button of their own. If the two were set differently before, neither option appears selected here, and picking one sets both.

User Settings - Side panels, Floating or Fixed

Components with its side panel fixed: a column against the edge instead of a card over the page

Motion

Grails follows your system’s Reduce motion setting. With it on, side panels, dialogs and menus open and close at once instead of sliding or fading. Loading indicators keep moving, so you can still tell that something is loading. There is nothing to set in Grails: you turn it on or off in your operating system’s accessibility settings.