Display & Interface Customization

PlantKeeper offers extensive customization options to make the interface work for you. This guide covers themes, layouts, dashboard configuration, and navigation preferences.

🎯 What You'll Learn

• How to choose and customize themes
• Dashboard layout customization options
• Plant view and card configuration
• Navigation and sidebar preferences

⚡ Quick Start

Access Display Settings:

1. Go to Settings → Display
2. Or click Customize Dashboard from dashboard

Quick Changes:

• Switch theme: Settings → Display → Theme → Select theme
• Change plant view: Dashboard → View dropdown → Select layout
• Compact mode: Settings → Display → Enable Compact Mode

📚 Complete Guide

Theme Settings

Choose a visual style that matches your preference and environment.

Theme Options:

🌞 Light Theme (Default):

• Bright, clean interface
• High contrast
• Best for: Well-lit rooms, daytime use
• Easy to read in sunlight

🌙 Dark Theme:

• Dark background, light text
• Reduced eye strain
• Best for: Evening use, dim lighting
• Saves battery (OLED screens)

🔄 Auto Theme (Recommended):

• Syncs with system settings
• Light during day, dark at night
• Best for: All-day use
• Adapts to environment

How to Change Theme:

1. Go to Settings → Display → Theme
2. Select Light, Dark, or Auto
3. Change applies immediately (no save needed)

Accent Color:

Customize the primary color used throughout PlantKeeper.

Pre-defined Palettes:

• 🟢 Botanical Green (default) - Natural, plant-focused
• 🔵 Ocean Blue - Calm, water-themed
• 🟣 Lavender Purple - Soft, relaxing
• 🟠 Terracotta Orange - Earthy, warm
• 🔴 Sunset Red - Bold, vibrant
• ⚫ Charcoal Gray - Professional, minimal

Custom Color Picker:

1. Go to Settings → Display → Accent Color
2. Click Custom Color
3. Use color picker or enter hex code
4. Preview changes in real-time
5. Click Apply

What Changes:

• Primary buttons
• Active navigation items
• Health status indicators (subtle tint)
• Progress bars
• Links and hover states

Compact Mode:

Condense the interface to fit more content on screen.

What Changes:

• Smaller padding and margins
• Denser tables and lists
• Smaller font sizes (still readable)
• More items per screen

When to Enable:

• Large plant collection (100+ plants)
• Small screen/laptop
• Power users who prefer density
• Data entry workflows

How to Enable:

1. Go to Settings → Display
2. Toggle Compact Mode
3. Refresh page to apply

Dashboard Customization

Configure your dashboard to show what matters most to you.

Statistics Cards:

Available Cards:

• 📊 Overview Stats - Total plants, health distribution
• 💧 Today's Tasks - Reminders due today
• 📈 Recent Growth - Latest measurements
• 🚨 Health Alerts - Plants needing attention
• 🎉 Milestones - Recent achievements
• 📅 Upcoming Care - Next 7 days of reminders
• 🌱 New Additions - Recently added plants
• 📔 Recent Diary - Latest entries

Show/Hide Cards:

1. Click Customize Dashboard (top-right on dashboard)
2. Toggle cards on/off
3. Drag to reorder
4. Click Save Layout

Recommended Configurations:

Beginner Setup (4 cards):

• Overview Stats
• Today's Tasks
• Health Alerts
• Recent Growth

Power User Setup (6 cards):

• Today's Tasks
• Upcoming Care
• Health Alerts
• Recent Growth
• Recent Diary
• Milestones

Minimalist Setup (2 cards):

• Today's Tasks
• Health Alerts

Card Settings:

Some cards have customizable options:

Overview Stats Card:

• Show/hide specific metrics
• Change chart type (pie, bar, list)

Today's Tasks Card:

• Group by plant or by task type
• Show photos or text-only

Recent Growth Card:

• Number of plants to show (3/5/10)
• Metric to display (height, leaves, width)

Upcoming Care Card:

• Days to look ahead (3/7/14)
• Filter by reminder type

Plant View Configuration

Customize how plants are displayed throughout PlantKeeper.

Default Plant View:

Choose the default view when opening plant lists.

View Options:

1. Grid View 📱 (Default):

• Cards in grid layout
• Shows photo, name, status
• Best for: Visual browsing
• Mobile-friendly

2. List View 📋:

• Rows in table format
• Shows more details per plant
• Best for: Quick scanning
• Sortable columns

3. Compact View 📊:

• Dense table layout
• Maximum information
• Best for: Large collections (50+ plants)
• Desktop only

Cards Per Row:

Control grid density (Grid View only).

Options:

• Auto (default) - Responsive (adapts to screen)
• 2 cards - Large cards (mobile-like on desktop)
• 3 cards - Balanced
• 4 cards - Dense (desktop monitors)

Screen Size Behavior:

• Mobile (< 640px): Always 1 card
• Tablet (640-1024px): 2-3 cards
• Desktop (> 1024px): 2-4 cards (your choice)

Plant Card Information:

Customize what appears on plant cards (Grid View).

Available Fields:

• ☑️ Location (e.g., "Living Room - West Window")
• ☑️ Species (scientific name)
• ☑️ Health status (color indicator)
• ☑️ Next watering (e.g., "Water in 2 days")
• ☑️ Reminder count (e.g., "3 reminders")
• ☑️ Growth sparkline (mini chart)

Default Setup (Recommended):

• ✅ Location
• ✅ Health status
• ✅ Next watering
• ❌ Species (shown in detail view)
• ❌ Reminder count (reduces clutter)
• ❌ Growth sparkline (advanced)

Minimalist Setup:

• ✅ Health status
• ✅ Next watering
• ❌ All others

Power User Setup:

• ✅ All fields (maximum information)

How to Configure:

1. Go to Settings → Display → Plant Cards
2. Toggle desired fields
3. Changes apply immediately

Remember Last View:

• Toggle to remember your last used view
• PlantKeeper opens to your preferred view
• Useful if you switch views frequently

Navigation Preferences

Customize the sidebar and navigation for your workflow.

Sidebar Behavior:

Options:

Always Visible (Default):

• Sidebar always shown
• Best for: Desktop users
• Quick navigation

Auto-Hide:

• Sidebar hides when not in use
• Hover to reveal
• Best for: Small screens, more space
• Mouse-friendly

Collapsed by Default:

• Sidebar shows icons only
• Click to expand
• Best for: Power users, keyboard navigation
• Maximum content space

How to Change:

1. Go to Settings → Display → Navigation
2. Select sidebar behavior
3. Or click hamburger icon (☰) to toggle

Quick Access Buttons:

Customize the quick action buttons in the sidebar.

Available Actions:

• ➕ Add Plant
• 💧 Log Watering
• 📔 Add Diary Entry
• 📏 Record Growth
• 🤖 Plant Doctor
• 📸 Add Photo
• 🔔 View Reminders
• 📊 View Analytics

Customize:

1. Go to Settings → Display → Quick Access
2. Select up to 4 actions
3. Drag to reorder
4. Click Save

Recommended Quick Actions:

• ➕ Add Plant
• 💧 Log Watering
• 📔 Add Diary Entry
• 🤖 Plant Doctor

Navigation Items:

Show/hide specific navigation items.

Core Items (Always shown):

• 🏠 Dashboard
• 🌱 Plants
• 🔔 Reminders

Optional Items (Toggle):

• ☑️ 📊 Analytics
• ☑️ 📔 Diary
• ☑️ 🤖 Plant Doctor
• ☑️ 📸 Gallery
• ☑️ ⚙️ Settings

Reorder Navigation:

1. Go to Settings → Display → Navigation
2. Click Reorder Items
3. Drag items to desired order
4. Click Save

Units and Measurements

Configure units to match your preference.

Measurement Systems:

Height/Width:

• Centimeters (cm) - Metric (default)
• Inches (in) - Imperial
• Meters (m) - Large plants

Temperature:

• Celsius (°C) - Metric (default)
• Fahrenheit (°F) - Imperial

Volume (Watering):

• Milliliters (ml) - Small amounts
• Liters (L) - Large amounts
• Fluid Ounces (fl oz) - Imperial
• Cups - Cooking measurements
• Gallons - Large containers

Weight (Fertilizer):

• Grams (g) - Metric (default)
• Ounces (oz) - Imperial
• Pounds (lb) - Large quantities

How to Change:

1. Go to Settings → Preferences → Units
2. Select preferred unit for each category
3. Click Save

Automatic Conversion:

• All existing data converts automatically
• No data loss
• Reversible (change back anytime)

Date and Time Preferences

Date Format:

• MM/DD/YYYY (US) - e.g., 10/24/2025
• DD/MM/YYYY (European) - e.g., 24/10/2025
• YYYY-MM-DD (ISO) - e.g., 2025-10-24

Time Format:

• 12-hour (AM/PM) - e.g., 2:30 PM
• 24-hour - e.g., 14:30

Timezone:

• Select your timezone from dropdown
• Auto-detect option (uses browser timezone)
• Affects reminder scheduling

First Day of Week:

• Sunday (US)
• Monday (International)
• Saturday (Middle East)

How to Change:

1. Go to Settings → Preferences → Date & Time
2. Select preferred formats
3. Changes apply immediately

Language Preferences

Interface Language:

Available languages:

• 🇺🇸 English (default)
• 🇪🇸 Spanish
• 🇫🇷 French
• 🇩🇪 German
• 🇵🇹 Portuguese
• More languages coming!

Plant Name Display:

Choose how plant names appear:

Options:

• Scientific names - e.g., "Monstera deliciosa"
• Common names - e.g., "Swiss Cheese Plant"
• Both (Recommended) - e.g., "Monstera deliciosa (Swiss Cheese Plant)"

How to Change:

1. Go to Settings → Preferences → Language
2. Select interface language
3. Select plant name preference
4. Refresh page to apply

💡 Tips & Tricks

Recommended Setup ⭐:

• Theme: Auto (adapts to time of day)
• View: Grid with 3 cards per row
• Dashboard: 4-6 most relevant cards
• Units: Your country's standard
• Sidebar: Always visible (desktop), collapsed (mobile)

Performance Tips:

• Enable compact mode for large collections
• Reduce dashboard cards if slow
• Dark theme saves battery on OLED screens
• Hide unused navigation items

Accessibility:

• Increase text size (browser zoom: Ctrl/Cmd + "+")
• High contrast themes coming soon
• Keyboard shortcuts available (see Keyboard Shortcuts)

Seasonal Themes (Future):

• Spring: Soft greens
• Summer: Bright yellows
• Fall: Warm oranges
• Winter: Cool blues

❓ Common Questions

Will my customizations sync across devices?

Yes! All display settings are account-level and sync across devices. Exception: Browser zoom level is device-specific.

Can I save multiple layout presets?

Not currently, but this is on our roadmap. For now, you can manually switch between configurations.

Does compact mode affect mobile view?

No, compact mode only affects desktop view. Mobile view is automatically optimized regardless of this setting.

How do I reset to default settings?

Go to Settings → Display → scroll to bottom → click "Reset to Defaults". This resets display settings only (doesn't affect plant data).

Can I hide the sidebar completely?

Not completely, but you can enable "Auto-Hide" mode so it only appears when you hover over the left edge of the screen.

🔗 Related Topics

• Dashboard Overview - Understanding your dashboard
• Plant Views - Different ways to view plants
• Account Settings - Manage your account
• Advanced Settings - Power user features

💡 Pro Tip: Spend 10 minutes customizing your dashboard on Day 1. A well-configured interface saves time every day and makes plant care more enjoyable!