---
title: "Settings page"
description: "A workspace settings screen for an invented ceramics shop: a grouped settings nav beside profile, notifications, members, billing and API keys."
plan: Pro
docs: https://ui.edbn.me/docs/templates/settings-page
---

# Settings page

A workspace settings screen for an invented ceramics shop: a grouped settings nav beside profile, notifications, members, billing and API keys.

Loam Studio is an invented ceramics shop. An app bar sits over a settings nav, grouped into Account and Workspace, beside one section at a time; each section opens with its title, a line on what it holds and its main action. The sections are the settings blocks, each self-contained: a profile form with a save footer, a notification matrix that saves as you go, members with roles and invites, the plan with usage and invoices, and API keys with reveal, copy and revoke. Opening a section moves focus to its heading, and hidden sections keep their state, so unsaved profile edits survive a trip elsewhere. Below 768px the nav becomes a select above the section.

A Pro page template built on Base UI and Tailwind CSS v4.

## Installation

This is a Pro item. Once per project, create a token at https://ui.edbn.me/dashboard/tokens, put it in `.env.local` as `EDBN_TOKEN`, and add the registry to `components.json`:

```json
{
  "registries": {
    "@edbn": {
      "url": "https://ui.edbn.me/r/{name}.json",
      "headers": { "Authorization": "Bearer ${EDBN_TOKEN}" }
    }
  }
}
```

Then install:

```bash
npx shadcn@4.19.0 add @edbn/settings-page
```

## Dependencies
- npm: lucide-react@^1.33.0
- edbn: edbn-base, alert-dialog, avatar, badge, button, card, dialog, dropdown-menu, dropzone, empty, field, input, input-group, item, label, meter, radio-group, scroll-area, select, separator, spinner, switch, table, tabs, text-link, textarea, tooltip

## Source

The source is part of Pro (https://ui.edbn.me/pricing). The install above adds it to the project, ready to edit.

## More app screens templates

All 2, with install commands: https://ui.edbn.me/docs/templates/app-screens · https://ui.edbn.me/docs/templates/app-screens.md

## For agents
- Base theme, once per project: npx shadcn@4.19.0 add https://ui.edbn.me/r/edbn-base.json
- MCP server with search, items, examples and source: https://ui.edbn.me/mcp
- Every page and item: https://ui.edbn.me/llms.txt