Neo-Futurist Design Systems

Themes

Each card is drawn with its own tokens. All six share the same token names and components, so switching is one attribute.

Color

Sixteen roles and a five-stop ramp. Wire colors draw lines, signal marks the one action, and status colors stay separate from both.

Surfaces and ink

Wire, signal and status

Ramp, for meshes, meters and height

Type

Every theme loads its faces from Google Fonts, so all visitors see the same letters. Where a face stands in for one from the Alien set, the table names the original.

Display

Wave signature

Body

Lines carry the image and fills stay dark. Use one wire color per object, let the ramp describe height or intensity, and keep the signal color for the single thing a person should press.

Data

F1 632 Hz F2 1525 Hz −6.2 dB

Label

Sound pressureAirflowChannel 14

Faces in this theme

Scale

Controls

Outlines glow and only the primary button is filled. The corner treatment changes per theme: pill, chamfer, square or skew.

Buttons

Fields Scene name Projection Sample rate Enter the rate in Hz, for example 44100.

Switches and ranges

Bloom Ground grid

Contours Labels Loop Once

Line weight

LiveClippingFaultMuted Shift-drag to orbit

Data

Readouts, meters and a line chart, all on sample values. State is carried by shape as well as color: solid, hollow, dashed.

Emitters live28of 30

Peak level−6.2dB

Frame time8.3ms

Response, sample curve

Channel levels, sample

Emitters, sample rows

ID	Azimuth	Elevation	Gain	State
E-01	0.0°	+62.0°	−3.0 dB	Live
E-07	137.5°	+35.4°	−4.5 dB	Live
E-12	222.5°	+14.0°	+0.8 dB	Clipping
E-19	85.0°	−12.3°	−∞	Muted
E-26	307.5°	−48.6°	n/a	Fault

Scene saved. 30 emitters and 2 materials written.

Channel 12 is clipping. Lower its gain by 1 dB or more.

E-26 is not responding. Check its cable, then press Rescan.

Graphics

Twelve line primitives and twelve pictograms. They are inline SVG that strokes with theme tokens, so each one recolors with the theme.

Primitives

Pictograms, after the Semiotic Standard tiles

Exports

Code for the active theme. The CSS drives React through one data attribute and the same object feeds three.js colors and bloom.

Shape and glow tokens in this theme

Names

Twenty names were considered for the kit. Vectorglow was chosen.