Anti-patterns

The rest of the design system describes what FDT surfaces look like. This page is the inverse: the patterns that produce wrong-looking output, grouped by failure mode.

Visual and interaction anti-patterns

• Green monospace terminal text as the dominant aesthetic
• Glitch effects, scanlines slapped on everything, “TV static” overlays
• Rounded corners above 8px anywhere
• Gradients on buttons or panels (radar-sweep gradients at 30% opacity are the sole exception)
• Hero images of soldiers in action
• Stencil typefaces, typewriter typefaces, or “military” display fonts
• Emoji or friendly illustration
• Drop shadows - the entire shadow vocabulary is replaced by the --glow-* system. If the instinct is to add a shadow, add a soft accent glow instead (or nothing).
• Neon / Tron / CRT bloom - glow is soft, atmospheric, and monochromatic in the accent. Sharp-edged neon lines, multi-color glow, and pulsing chromatic aberration are all off-limits.
• Decorative glow - a halo on a static, inactive element is wrong. Glow signals “live” or “active” or “engaged.” If the element isn’t doing anything, it doesn’t glow.
• Decorative use of red - red means hostile, always
• A second brand accent color - the system is mono-accent. Product surfaces differentiate themselves through glow intensity and texture, not through a different hue.
• Marketing language like “paradigm-shifting,” “revolutionary,” “next-generation”

Accessibility failures - reject with equal force

• electric-500 or hostile as body-text color. Both fail AA at ~4:1. Use electric-400 / hostile-400 for inline prose. 500-level is for fills and large text only.
• White labels on success (neutral green) or warning (caution amber) buttons. Ships at 3.0:1 and 1.8:1 - catastrophic. Dark labels (navy-900) are mandatory on these variants.
• steel-400 as body text. 3.3:1 - UI-only. Secondary copy uses steel-300 or lighter.
• Color alone as a signal. If removing the color leaves the meaning ambiguous, the design is incomplete. Pair with shape, icon, position, or text.
• Removing focus indicators. The two-layer focus (border + glow) is load-bearing. “The glow is enough” is not correct - the solid 2px border carries the 3:1 UI contrast requirement; the glow is additive.
• Ignoring forced-colors: active. Gov/mil workstations enforce this. Components that hard-code backgrounds without ButtonFace / Canvas fallbacks ship broken on those endpoints.
• Red/green distinction without shape reinforcement. The hostile/neutral pair is the most common color-blind failure mode. Always pair with APP-6D shape or a text label.