Packages
mob
0.6.12
0.7.20
0.7.19
0.7.18
0.7.17
0.7.16
0.7.15
0.7.14
0.7.13
0.7.12
0.7.11
0.7.10
0.7.9
0.7.8
0.7.7
0.7.6
0.7.5
0.7.4
0.7.3
0.7.2
0.7.1
0.7.0
0.6.26
0.6.25
0.6.24
0.6.23
0.6.22
0.6.21
0.6.20
0.6.19
0.6.18
0.6.17
0.6.16
0.6.15
0.6.14
0.6.13
0.6.12
0.6.11
0.6.10
0.6.9
0.6.8
0.6.7
0.6.6
0.6.5
0.6.2
0.6.1
0.6.0
0.5.18
0.5.17
0.5.16
0.5.15
0.5.14
0.5.11
0.5.10
0.5.7
0.5.6
0.5.5
0.5.4
0.5.3
0.5.2
0.5.1
0.5.0
0.4.0
0.3.10
0.3.9
0.3.8
0.3.7
0.3.6
0.3.5
0.3.4
0.3.3
0.3.2
0.3.1
0.3.0
0.2.0
0.1.0
BEAM-on-device mobile framework for Elixir
Current section
Files
Jump to
Current section
Files
lib/mob/theme/dark.ex
defmodule Mob.Theme.Dark do
@moduledoc """
High-contrast greyscale dark theme.
Designed for low-light / nighttime use where bright screens are blinding.
Near-black background (not pure black, to avoid OLED smear), light grey
text, mid-grey accents. Functional first, decorative second.
## Usage
defmodule MyApp do
use Mob.App, theme: Mob.Theme.Dark
end
See `Mob.Theme.Adaptive` for a theme that follows the OS-level
light/dark setting automatically.
"""
@doc "Returns the compiled Dark theme struct."
@spec theme() :: Mob.Theme.t()
def theme do
Mob.Theme.build(
# ── Brand ──────────────────────────────────────────────────────────────
# near-white — primary buttons stay readable at low brightness
primary: 0xFFE6E6E6,
on_primary: 0xFF0A0A0A,
# mid grey
secondary: 0xFF8A8A8A,
on_secondary: 0xFF0A0A0A,
# ── Surfaces ───────────────────────────────────────────────────────────
# near-black, not pure black (avoids OLED smear and feels less harsh)
background: 0xFF0A0A0A,
# near-white text — WCAG AAA contrast on near-black
on_background: 0xFFEEEEEE,
# dark grey card — subtle separation from background
surface: 0xFF1A1A1A,
# slightly lighter card-on-card
surface_raised: 0xFF2A2A2A,
on_surface: 0xFFEEEEEE,
# mid grey — captions, placeholders
muted: 0xFF888888,
# ── Utility ────────────────────────────────────────────────────────────
# brighter red — pops on dark bg without being aggressive
error: 0xFFEF5350,
on_error: 0xFF0A0A0A,
# mid-dark grey — visible divider on dark bg
border: 0xFF3A3A3A
)
end
end