Sci-Fi HUD Console

StyleRef·@styleref·

Extract your style to start building your Style Board.

Made with this StyleRef

Same style, different prompts.

One vehicle-details screen, alone in the frame — the style at the size a gallery card shows it.

An in-car display: map, proximity view and a large speed gauge in one wide frame.

Three columns of payment UI: a product card, a chat panel and a send-money form.

Loose UI parts under one treatment — the components a design system ships.

Description

A dark technical surface covered in overlays: thin neon rules, corner brackets, live readouts and dense telemetry. Precision geometry doing the decorating, with data as the visual material.

Mood & Personality

Futuristic, Serious, Confident, Tense

Energy Level

Active

Emotional Bias

Tense

Tone Register

Detached

Representation Mode

Symbolic

Real-world Accuracy

Precise

Characters

Forbidden

Voice & Language

Formality

Formal

Vocabulary Level

Technical

Directness

Explicit

Sentence Length

Fragments

Metaphor Density

Clinical

Writing Perspective

Third person

Copy Pacing

Staccato

Jargon / Technical Level

Acronym-heavy

Spatial Structure & Hierarchy

Grid System

Baseline grid

Visual Density

Packed

Hierarchy Clarity

Moderate

Symmetry

Near symmetry

Balance Type

Edge-weighted

Layout Axis

Edge rails, top status strip, bottom panels, central live canvas

Perspective Style

Flat

Focal Structure

Primary + secondary

Plane Separation Method

Overlap

Framing Devices

Vignetted Perimeter

Shape Language

Shape Basis

Geometric

Primitive Dominance

Polygons, Circles

Edge Sharpness

Razor-sharp

Silhouette Clarity

Complex

Curve Consistency

Uniform radius

Negative Space Usage

Minimal

Angle Usage

Frequent

Line & Stroke System

Stroke Usage

Structural outlines

Stroke Weight

Hairline

Stroke Consistency

Uniform

Stroke Color

Contrasting accent

Stroke Joins

Miter

References

Temporal Reference

Futuristic

Reference Brands

Film and game screen-graphics interface design

UI & Web

Color Theme

Dark

Background Tone

Deep black

Accent Strategy

Workflow / contextual accents

Semantic Colors

Full set (error / warning / success / info)

Layout Archetype

Dashboard

Content Width

Full-bleed

Density

Compact

Spacing Scale

4pt grid

Surface Layers

Three-layer (page + card + elevated)

Elevation Approach

Background contrast only

Glass / Blur Effect

Subtle tint overlay

Border Philosophy

Hairline (0.5–1px, low opacity)

Corner Radius Scale

Sharp (0px)

Card Style

Translucent dark panels with a single bright edge; corner brackets replace full borders

Icon Style

Outline / Stroke

Icon Weight

Thin (1px)

Navigation Pattern

Sidebar

Data Display Style

Dense table

Data Visualization Style

Gridded analytical

Focus Ring Style

Glow halo

Animation Philosophy

Functional only

Transition Speed

Instant

Container / Boundary

Container presence

Implicit (visual edges only)

Corner treatment

Sharp

Container Dominance

Visual element

Padding rules

Tight

Edge behavior

Clipped elements

Camera and Motion

Easing Function

Sharp step

Animation Duration Feel

Snappy

Animation Sequencing

Panel brackets draw first; content follows

Motion Intensity

Constant low-level telemetry activity

Motion Implication

Dynamic

Camera Movement

Rotating sweep lines; bracket-snap target acquisition

Artistic Mediums & Techniques

Physical Medium

None

Illustrative Technique

Vector illustration

Background & Environment

Background Type

Solid color

Environment Mood

Abstract

Background Complexity

Moderate

Guardrails

Common Artifacts to Avoid

Over-saturation, Stylistic filters

Avoided Visuals

purple-and-pink cyberpunk palettes; large filled color panels; decorative circular gauges; illegible microtype

Allowed Visuals

thin luminous rules; corner brackets; tick scales; crosshairs; readable dense telemetry; wireframe diagrams; low-opacity glow

Colors

#05080F55%Usage: Background

#0C152620%Usage: Panel surfaces

#3BE8FF10%Usage: Primary telemetry

#C9E3F07%Usage: Readouts

#5D7A944%Usage: Secondary telemetry

#FFB0202%Usage: Caution states

#FF3B4E2%Usage: Alarm states

Palette Size

6–8 colors

Color Temperature

Cool

Saturation Range

Electric

Contrast Strategy

High contrast

Hue Relationships

Complementary

Gradient Policy

Subtle gradients only

Color Dominance

Background-dominant

Black & White Point

Pure black + Rolled-off highlights

Accessibility Level

WCAG AA

Typography

Regular, Medium, Aa, Bb, Typography

Font FamilyCondensed grotesque labels paired with monospaced numeric readouts

Line HeightTight

Font WeightsRegular, Medium, Bold

Letter SpacingWide

Type ScaleModular

Text Case

ALL CAPS

Font Pairing Strategy

Condensed grotesque + monospace numeric system

Hierarchy

Strong contrast

Text Presence

Required

Text Visual Role

Integrated into imagery

Text Integration

Overlaid

Output Format

Creative Discipline

UI/UX

Medium

Digital

Delivery Mode

Interactive

Platform

Desktop

Presentation Context

Raw UI

Light & Shadow

Lighting Mood Style

Emissive HUD lines on a persistently near-black ground

Bloom / Glow Usage

Subtle

Lighting Presence

Implied

Surface, Material & Detail

Surface Treatment

Flat

Surface Texture Style

Faint scanlines or dot-grid overlay with subtle digital noise

Texture Usage

Subtle noise

Transparency / Opacity

Semi-transparent

Pattern / Motif Usage

Geometric pattern

Custom Style Items

Panel Grammar

Corner brackets replace full borders; ticks and scales persist along panel edges.

Color Discipline

Reserve cyan for active telemetry, amber for caution, and red for alarms; keep all color areas thin and sparse.

Information Planes

Reticle above map, map above grid, with telemetry layered across the interface.

Numeric Focal Point

One oversized monospaced numeric readout anchors otherwise small, dense type.

......X