NotumComponents

← HOME · DYNAMIC · NOTUM ROBOTICS · N-R.HR

Procedural UI audio — deterministic, seeded, computed on the fly. Same string = same sound, always.

MASTER VOLUME [ 20% ]
MAX DURATION [ 80% ]
MUSICAL SCALE
PENTA
MINOR
LYDIAN
DORIAN
WHOLE
CHROM
SOUNDSCAPE
RETRO
HARMONIC
nCARS
nCARS 2
TEST INPUT
PLAY
HASH
NAV
CONFIRM
WARN
ERROR
GLOBAL SEED [ 2026 ]
2026
+

Bin-packed layout — components sized proportionally to their function.

DEFAULT
PRIMARY
WARNING
DANGER
FULL WIDTH PRIMARY
FULL WIDTH AMBER WARNING
SYNC ALL DEVICES

Icon-only buttons — compact controls for toolbars and dense layouts. Toggle buttons flip on/off on click.

YES / NO
WARNING
DANGER
MULTI OPTION
INFO ONLY
MODE SELECT
AUTO
MANUAL
SCHEDULE
FAN SPEED
OFF
LOW
MED
HIGH
BRIGHTNESS [ 70% ]
TEMPERATURE [ 22°C ]
CPU LOAD [ 84% ]
TIMER (MIN)
15
+
THRESHOLD
42
+
SYSTEM STATUS
UPTIME 14D 07:32:19
MEMORY [ 2.4 / 4.0 GB ]
DISK [ 87% USED ]
NETWORK [ 3 ERRORS ]
FIRMWARE V2.4.1-RC3
DOWNLOAD PROGRESS [ 68% ]
BATTERY [ 23% ]
FIRMWARE UPDATE [ 100% ]
BG
#0A0A0A
SURFACE
#141414
TEXT
#F4F4F4
ACCENT
#00E5FF
AMBER
#FFB300
DANGER
#FF3333

Click cards to toggle — observe icon fill, border glow, corner strobe, and state label.

MAIN LIGHT
[ ACTIVE ]
ON
EXHAUST FAN
[ DISABLED ]
OFF

Same card element, dynamically adapted via data-size attribute. Sizes follow grid logic: 2×2 (full), 2×1 (half-height), 1×2 (half-width), 1×1 (quarter, icon only). Smaller variants progressively hide text and status elements.

DOOR LOCK
[ LOCKED ]
ON
DOOR LOCK
[ LOCKED ]
ON
DOOR LOCK
[ UNLOCKED ]
OFF
DOOR LOCK
[ LOCKED ]
ON
DOOR LOCK
[ UNLOCKED ]
OFF

Universal component properties — lockout, progress, status, active state. API: nComp.progress(el, 0–100), nComp.status(el, 'ok'|'warn'|'error'|'busy'), nComp.active(el, bool).

PROGRESS

Click buttons to trigger simulated async operations with progress + status feedback.

UPLOAD
SCAN NETWORK
FIRMWARE UPDATE
STATUS

Each button shows a persistent status pip (top-right) and status-colored border.

OK
WARN
ERROR
BUSY
LOCKOUT

Configurable cooldown per element via data-lockout attribute. Button dims during extended lockout.

200MS
1000MS
2000MS
5000MS
COMBINED — LOCKOUT + PROGRESS + STATUS

Each button locks out for the duration of its operation, drives progress, and reports status. All three properties active simultaneously.

DEPLOY BUILD
FULL BACKUP
PURGE CACHE
DIAGNOSTICS
OTA UPDATE — SLOW TRANSFER
ACTIVE / INACTIVE

Click TOGGLE PAIR to swap active state between the two target buttons.

TOGGLE PAIR
TARGET A
TARGET B

Vertical segmented bars (read-only) and vertical sliders (interactive). Drag up/down to adjust sliders.

SIGNAL
[ 70% ]
BATTERY
[ 20% ]
FUEL
[ 100% ]
VOLUME
[ 60% ]
THROTTLE
[ 20% ]
PRESSURE
[ 90% ]