OLED Black Interface

STYLE REFERENCE — HARD CONSTRAINT (HIGHEST PRIORITY)

This style must be applied to ALL generated content (text, image, video).
If any part of the request conflicts with this style, the style OVERRIDES the request.
STYLE DEFINITION (to be operationally enforced):

OLED Black Interface

 • Output Format: Creative discipline: UI/UX; Digital; Delivery mode: Interactive; Mobile; Presentation: Raw UI.
 • Container / Boundary: Container: Implicit (visual edges only); Container Dominance: Invisible (purely functional); Padding: Generous; Edge Behavior: Intentional bleed.
 • Mood & Personality: Sophisticated, Minimalist, Confident; Energy: Mellow; Emotional bias: Neutral; Tone register: Detached; Representation mode: Literal; Real-world accuracy: Precise.
 • Colors: Palette: Solid Colors: [ #000000 70% (Background),  #141414 10% (Elevated surfaces),  #DEDEDE 8% (Primary text),  #8F8F8F 5% (Secondary text),  #262626 3% (Dividers),  #3DE0D5 2% (Accent),  #F0A93B 2% (Accent)]; 6–8 colors; Cool temperature; Saturation: Subdued; Value contrast; Hue relationships: Complementary; Subtle gradients only; Color dominance: Background-dominant; Black/White point: Pure black + Rolled-off highlights; Accessibility: WCAG AA.
 • Typography: Grotesque; Regular, Medium; Text case: Sentence case; Font pairing: Weight contrast; Hierarchy: Clear typographic scale; Type scale: Modular; Normal (1.4); Letter spacing: Wide; Text presence: Required; Text visual role: Secondary visual element; Text integration: Overlaid.
 • Light & Shadow: Lighting presence: Implied; Lighting mood style: Low-key; Shadow type: None; Bloom / Glow usage: Low-opacity soft outer glow on accents and faint color halos around imagery.
 • Spatial Structure & Hierarchy: Grid system: Column grid; Visual density: Comfortable; Hierarchy: Strong; Layout axis: Vertical; Symmetry: Asymmetrical balance; Balance: Edge-weighted; Flat perspective; Plane separation: Color/value shift.
 • Surface, Material & Detail: Surface treatment: Matte; Texture: No texture; subtle noise dither only on large tinted panels; Texture usage: Subtle noise; Imperfection level: Flawless; Transparency: Opaque.
 • Camera and Motion: Transition: Dissolve; Animation duration: Standard.
 • Shape Language: Negative space usage: Dominant.
 • Voice & Language: Formality: Professional; Conversational vocabulary; Directness: Straightforward; Short sentences; Metaphors: Literal; Perspective: Second person (you); Pacing: Punchy; Emoji usage: None.
 • Background & Environment: Background type: Solid color; Environment mood: Abstract; Background–Subject: Contrasting; Background complexity: Minimal.
 • References: Minimalism; Temporal reference: Contemporary.
 • UI & Web: Animation: Functional only; Transition speed: Standard (200–300ms); Hover: Pressed elements briefly brighten; no scale response; Color theme: Dark; Background tone: Deep black; Accent strategy: Dual accent; Layout archetype: Feed or master–detail, prioritized by product context; Content width: Full-bleed; Density: Comfortable; Surface layers: Two-layer (page + card); Elevation: Background contrast only; Shadow technique: No shadows; Glass effect: Subtle tint overlay; Borders: Borderless; Card style: Filled tint; Icon style: Outline / Stroke; Icon weight: Regular (1.5px); Navigation: Bottom tab bar; Nav style: Sticky glass (blur); UI imagery: Photography; Focus ring: Glow halo.
 • Guardrails: Avoid: AI Gloss / Plastic Smoothing, Heavy Bokeh / Blur, Lens Flare, Over-saturation, Studio Post-processing; Avoid Visuals: dark gray backgrounds; pure white body text; small bold text; fully bright saturated accents; drop shadows; inverted light-theme components; hard-edged image boxes; Allowed Visuals: true-black ground; lifted matte surfaces; #DEDEDE primary text; #8F8F8F secondary text; dim luminous accents; soft accent glow; full-bleed imagery fading into black; 1.5px outline icons.
 •  OLED Luminance Rule: Keep all interface chrome below media and imagery in luminance; express elevation through lifted black surfaces, never shadows., Image Edge Treatment: High-contrast media is the color source; fade image edges gradually into the true-black ground., Typography OLED Compensation: Use Regular and Medium only; reduce weights one step from a light variant to prevent OLED glow and smearing..


ENFORCEMENT RULE: Before finalizing the output, internally verify that ALL elements comply with the style definition above. If compliance is uncertain, simplify or soften the output until it fully matches the style. Generated by StyleRef.io

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.

A connected-car app across three screens: garage, vehicle detail and efficiency charts.

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

A vehicle OS with an icon rail, drive readouts, a map and a music player.

Shipment list beside a full-height map — the style handling a live tracking view.

Description

A true-black interface where the screen's unlit pixels are the background and everything else glows against them. Restrained contrast, luminous accents, and imagery that carries the color.

Colors

#00000070%Usage: Background

#14141410%Usage: Elevated surfaces

#DEDEDE8%Usage: Primary text

#8F8F8F5%Usage: Secondary text

#2626263%Usage: Dividers

#3DE0D52%Usage: Accent

#F0A93B2%Usage: Accent

Palette Size

6–8 colors

Color Temperature

Cool

Saturation Range

Subdued

Contrast Strategy

Value 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

Output Format

Creative Discipline

UI/UX

Medium

Digital

Delivery Mode

Interactive

Platform

Mobile

Presentation Context

Raw UI

Spatial Structure & Hierarchy

Grid System

Column grid

Visual Density

Comfortable

Hierarchy Clarity

Strong

Layout Axis

Vertical

Symmetry

Asymmetrical balance

Balance Type

Edge-weighted

Perspective Style

Flat

Plane Separation Method

Color/value shift

Camera and Motion

Transition Type

Dissolve

Animation Duration Feel

Standard

References

Cultural References

Minimalism

Temporal Reference

Contemporary

Custom Style Items

OLED Luminance Rule

Keep all interface chrome below media and imagery in luminance; express elevation through lifted black surfaces, never shadows.

Image Edge Treatment

High-contrast media is the color source; fade image edges gradually into the true-black ground.

Typography OLED Compensation

Use Regular and Medium only; reduce weights one step from a light variant to prevent OLED glow and smearing.

UI & Web

Animation Philosophy

Functional only

Transition Speed

Standard (200–300ms)

Hover Treatment

Pressed elements briefly brighten; no scale response

Color Theme

Dark

Background Tone

Deep black

Accent Strategy

Dual accent

Layout Archetype

Feed or master–detail, prioritized by product context

Content Width

Full-bleed

Density

Comfortable

Surface Layers

Two-layer (page + card)

Elevation Approach

Background contrast only

Shadow Technique

No shadows

Glass / Blur Effect

Subtle tint overlay

Border Philosophy

Borderless

Card Style

Filled tint

Icon Style

Outline / Stroke

Icon Weight

Regular (1.5px)

Navigation Pattern

Bottom tab bar

Navigation Style

Sticky glass (blur)

UI Imagery

Photography

Focus Ring Style

Glow halo

Mood & Personality

Sophisticated, Minimalist, Confident

Energy Level

Mellow

Emotional Bias

Neutral

Tone Register

Detached

Representation Mode

Literal

Real-world Accuracy

Precise

Light & Shadow

Lighting Presence

Implied

Lighting Mood Style

Low-key

Shadow Type

None

Bloom / Glow Usage

Low-opacity soft outer glow on accents and faint color halos around imagery

Background & Environment

Background Type

Solid color

Environment Mood

Abstract

Background–Subject Relationship

Contrasting

Background Complexity

Minimal

Typography

Regular, Aa, Bb, Typography

Font FamilyGrotesque

Line HeightNormal

Font WeightsRegular, Medium

Letter SpacingWide

Type ScaleModular

Text Case

Sentence case

Font Pairing Strategy

Weight contrast

Hierarchy

Clear typographic scale

Text Presence

Required

Text Visual Role

Secondary visual element

Text Integration

Overlaid

Voice & Language

Formality

Professional

Vocabulary Level

Conversational

Directness

Straightforward

Sentence Length

Short

Metaphor Density

Literal

Writing Perspective

Second person (you)

Copy Pacing

Punchy

Emoji Usage

None

Container / Boundary

Container presence

Implicit (visual edges only)

Container Dominance

Invisible (purely functional)

Padding rules

Generous

Edge behavior

Intentional bleed

Shape Language

Negative Space Usage

Dominant

Surface, Material & Detail

Surface Treatment

Matte

Surface Texture Style

No texture; subtle noise dither only on large tinted panels

Texture Usage

Subtle noise

Imperfection Level

Flawless

Transparency / Opacity

Opaque

Guardrails

Common Artifacts to Avoid

AI Gloss / Plastic Smoothing, Heavy Bokeh / Blur, Lens Flare, Over-saturation, Studio Post-processing

Avoided Visuals

dark gray backgrounds; pure white body text; small bold text; fully bright saturated accents; drop shadows; inverted light-theme components; hard-edged image boxes

Allowed Visuals

true-black ground; lifted matte surfaces; #DEDEDE primary text; #8F8F8F secondary text; dim luminous accents; soft accent glow; full-bleed imagery fading into black; 1.5px outline icons

......X