Settings Pattern
Organizing settings into 9 clear categories with special emphasis on privacy transparency and user control.
9 Settings Categories
Fidus organizes all settings into logical categories that match user mental models.
Account
Email, password, 2FA, delete account
Privacy
Data sharing, tracking, privacy report
Notifications
Email, push, in-app preferences
Calendar
Default calendar, sync, time zone
Finance
Default currency, budget alerts
Travel
Home location, travel preferences
Appearance
Theme, language, density
Integrations
Connected apps, OAuth tokens
Advanced
Export data, API keys, developer mode
Interactive Settings Example
Settings use a sidebar navigation pattern on desktop. Click categories to explore different sections.
SETTINGS
Account
Manage your account details and security settings.
Two-Factor Authentication
Add an extra layer of security to your account
Danger Zone
Setting Types
Different types of settings use appropriate UI components.
| Type | Component | Example |
|---|---|---|
| Toggle | ToggleSwitch | Dark mode, notifications enabled |
| Select | Select | Theme, language, time zone |
| Input | TextInput | Email, API key |
| Multi-select | Checkbox Group | Notification channels |
Usage Guidelines
When to use
- •Users need to configure application behavior
- •Multiple settings categories exist (3+)
- •Privacy controls are important to users
- •Account management features are needed
Best practices
- •Group related settings into logical categories
- •Provide a search bar for finding specific settings
- •Show privacy impact for data-related settings
- •Use autosave for simple toggles
- •Require confirmation for dangerous actions
- •Provide data export in multiple formats
Accessibility
- •Use nav for sidebar, main for content area
- •Focus moves to content when category changes
- •All form controls have descriptive labels
- •Provide skip links for keyboard users
- •Announce settings changes with toast messages
Do's and Don'ts
✓ Do
- •Group related settings into logical categories
- •Show privacy impact for data-related settings
- •Use autosave for simple toggles
- •Require confirmation for dangerous actions
- •Provide data export in multiple formats
- •Make privacy settings prominent and easy to find
✗ Don't
- •Bury important settings in obscure menus
- •Use technical jargon without explanations
- •Hide data collection practices
- •Allow account deletion without confirmation
- •Make privacy settings hard to discover
- •Force users through lengthy forms to change simple settings
Related Components
ToggleSwitch
Boolean settings
Select
Dropdown options
TextInput
Text settings
Button
Actions
Modal
Confirmations
Alert
Warnings and info