Millclock-style Nixie Configurator — HTML5/CSS3 + JS

Nixie Clock Configurator — web page for configuring a nixie clock in Millclock style with live lamp preview.

Task
• Convey a branded dark style, make the page responsive, with live preview and instant application of settings.
• Support for seconds, 12/24 format, various separator modes, brightness, backlighting, Wi-Fi, and NTP synchronization.
• Localization EN/DE.

Stack

HTML5, CSS3 (custom props, grid), JavaScript (ES6)

Layout
• Architecture: semantic header/main/section/footer, modular section cards.
• Styles: CSS variables in :root (colors, radii, shadows, glow), custom toggles and selects in iOS style.
• JS logic: reactive preview updates (time formats, separator, brightness, color), soft blinking of the separator (~1 s).
• Responsive: clamp typography, grids, fluid sizes of lamps and separators while maintaining proportions.

Functionality Scope
• Time & Date: time format, time zone, DST (US/EU/OFF), date, Set Time.
• Display & Lighting: brightness, LED color (RGB), glow/animation mode, night mode, auto-dimming.
• Connectivity: SSID/Password, NTP, connection test.
• Sound & Alarms: hourly chime, alarms, volume.
• Modes & Safety: slot machine, temperature units, temperature display.
• System: device name, updates, firmware, reset.
• Separator: blinking/static/off; separate "small" nixie separator with options ":" and "."
• Special characters: °C and °F in nixie style.

#Nixie #UI #UX #WebDesign #Frontend #HTML5 #CSS3 #JavaScript #SVG #Canvas #Animation #Responsive #DarkTheme #IoT #Clock #Millclock #Accessibility #Localization