Overview
Dark Mode transforms JobTread's bright interface into a beautiful dark theme that reduces eye strain during long work sessions. Perfect for late-night project planning or bright office environments.
Key Features
- Full Interface Coverage - Darkens all JobTread pages consistently
- Eye Strain Reduction - Easier on your eyes in low-light environments
- Customized for Construction - Optimized for construction management workflows
- Instant Toggle - Turn on/off without page reload
- Syncs Across Devices - Preference saves to your Chrome account
- Mutually Exclusive - Auto-disables Contrast Fix and Custom Theme
Getting Started
Enabling Dark Mode
- Click the JT Power Tools extension icon
- Find the "Dark Mode" toggle
- Toggle it ON
- JobTread instantly switches to dark theme
Benefits
Health & Comfort
- Reduced Eye Strain - Less harsh light emission
- Better Sleep - Less blue light exposure before bed
- Reduced Headaches - Easier on sensitive eyes
- OLED Battery Savings - Uses less power on OLED screens
Work Environment
- Dim Offices - Screen won't light up the room
- Shared Spaces - Less distracting to nearby coworkers
- Field Work - Easier to read in vehicle cabs at dusk/dawn
- Late Hours - Comfortable for evening project reviews
Color Scheme
Background Colors
- Main Background - Dark charcoal (#1a1a1a)
- Cards & Panels - Slightly lighter dark gray (#2d2d2d)
- Hover States - Subtle brightening for feedback
Text Colors
- Primary Text - Off-white for readability (#e0e0e0)
- Secondary Text - Dimmed gray for less important info (#a0a0a0)
- Links - Bright blue that pops on dark background
Accent Colors
- Success States - Muted greens
- Warnings - Softer oranges
- Errors - Dimmed reds
- Info - Subdued blues
Feature-Specific Adaptations
Schedule View
- Task cards have darkened backgrounds with preserved color accents
- Date headers are clearly visible with light text
- Drop zones (for drag & drop) use subtle dark overlays
- Current date highlighting adapts to dark theme
Budget View
- Budget groups maintain hierarchy with dark shading
- Line items are clearly separated
- Number columns remain easy to scan
- Yellow edit highlighting adjusted for dark background
Text Formatter
- Formatting toolbar adopts dark theme
- Button hover states work in dark context
- Active formatting buttons clearly highlighted
- Color preview adapts to dark background
Compatibility
Works With
- Schedule Drag & Drop (Premium)
- Text Formatter
- Quick Job Switcher
- Budget Hierarchy Shading
Mutually Exclusive With
- Contrast Fix (has its own contrast rules)
- Custom Theme (Premium - for personalized themes)
Theme Exclusivity
Enabling Dark Mode automatically disables Contrast Fix and Custom Theme. You can only use one appearance mode at a time.
Troubleshooting
Some Elements Still Light
Solution:
- Some JobTread elements may not be covered by the theme
- Refresh the page to ensure all CSS is loaded
- Report specific elements on GitHub for future updates
Colors Look Washed Out
Solution:
- Adjust your monitor's brightness and contrast settings
- Some color muting is intentional to reduce eye strain
- Try Custom Theme (Premium) for brighter color options
Text Hard to Read
Solution:
- Increase browser zoom level (Ctrl/Cmd +)
- Adjust monitor brightness
- Check if your monitor has a "reading mode" setting
Best Practices
- Use Dark Mode consistently (switching back and forth can strain eyes)
- Combine with reduced monitor brightness for maximum comfort
- Enable Night Light/Night Shift on your OS for evening work
- Take regular breaks to look away from screen
Related Guides