> ## Documentation Index
> Fetch the complete documentation index at: https://flex-theme.bjanczak.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Details and motion

> Text size, label case, motion and five light/dark transition choices.

| Setting | Default | Accepted values |
| - | - | - |
| `font_size` | `14` | `12`, `13`, `14`, `15`, `16` px. |
| `motion` | `true` | Boolean. |
| `uppercase_labels` | `false` | Boolean. |
| `theme_transition` | `reveal` | `none`, `reveal`, `eclipse`, `split`, `rise`. |

Body size feeds the shared interface typography; intentional heading and compact
metadata sizes keep their hierarchy. Uppercase labels controls normal form-label
presentation rather than rewriting stored field names or application text.

Theme transition changes the visual switch between native light and dark mode.
It does not enable a mode that the panel forbids. With `motion: false`, the
runtime resolves decorative theme switching to `none`; supported animations also
respect the visitor's reduced-motion preference.

```php theme={"theme":{"light":"github-light","dark":"github-dark"}}
use Flex\Theme\FlexThemePlugin;
use Flex\Theme\Keyboard\ShortcutConfiguration;

FlexThemePlugin::make()->settingsOverrides([
    'font_size' => 15,
    'motion' => true,
    'uppercase_labels' => false,
    'theme_transition' => 'split',
]);

// A dedicated transition choice also locks its editor control.
FlexThemePlugin::make()->shortcuts(
    ShortcutConfiguration::make()->themeTransition('eclipse'),
);
```

Do not pass arbitrary body sizes or animation names. Use `spacing` and
`row_height` in [Layout](https://flex-theme.bjanczak.com/docs/theme-settings/layout.md#sticky-topbar-and-density)
for density, and the independent corner scales in
[Appearance](https://flex-theme.bjanczak.com/docs/theme-settings/appearance.md#radius-and-radius-form) for shape.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.