# Mira Visual System

> **Mode skill.** Default-enabled on the Brand specialist.

- Skill: `ferroxlabs/mira-visual-system` (Agent Skill)
- Install (CLI): `npx skillmds@latest add ferroxlabs/mira-visual-system`
- Raw SKILL.md: https://api.skillmd.com/api/skills/ferroxlabs/mira-visual-system/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: FerroxLabs (https://skillmd.com/u/ferroxlabs)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/ferroxlabs/mira-visual-system

---


# visual-system

**Mode skill.** Default-enabled on the Brand specialist.

## When to use

Use after the onlyness statement is locked in `TEAM_MEMORY.md` and the team needs a working visual system: typography, color, layout density, motif, plus the voice rules Copy writes inside. Use when a user asks for "the look," a logo direction, a palette, a font pairing, or a style guide. If onlyness is not locked, run `brand-foundation` first.

Trigger phrases: "Give me a palette." / "What fonts should we use?" / "Build a mini style guide." / "What's our visual identity?"

## Procedure

**1. Re-anchor on the dominant attribute.** Read the locked onlyness statement and its dominant attribute back to the user. Every choice below must signal that one word.

**2. Typography first — it carries the personality.** Pick **two type voices**: one for display (headlines, hero, logotype) and one for body (paragraphs, UI, captions). Decide in this order:

- **Display face voice.** Serif = considered, editorial. Geometric sans = engineered, modern. Humanist sans = warm, approachable. Slab = sturdy, declarative. Mono = technical, raw, honest. Display/custom = high-attitude, niche.
- **Body face.** Different family, compatible x-height. Body carries trust; pick legibility before character.
- **One contrast move.** Either weight contrast (thin display against regular body) or family contrast (serif display against sans body). Not both — two moves becomes noise.

State the *why* in one sentence per choice. *"Slab display because the attribute is unflinchingly honest, and slab carries declarative weight without smiling."*

**3. Color — one ownable hue, then a working set.**

- **One ownable hue.** Pick one chromatic color the brand owns. Avoid default category colors (blue for SaaS, green for sustainability, black for luxury) unless you have a reason to fight inside the cliché.
- **One supporting accent.** A second color that does the work the primary won't (warm CTA against cool primary, muted neutral against saturated lead).
- **Working neutrals.** A near-black (almost never #000), one off-white background, one mid-gray for borders and secondary text. Three, not five.
- **One reason per choice.** *"Desaturated and slightly green — signals clinical precision over corporate familiarity."*

**4. Layout density.** Choose one: **dense** (small type, tight tracking, lots of information on screen — signals expertise and seriousness) or **spacious** (large type, generous whitespace, one idea per view — signals confidence and calm). Density is a brand statement. Mixing reads as indecision.

**5. Motif and image style.** Pick **one** visual mark, pattern, illustration system, or photographic treatment. Plus one written "never" rule for images the brand won't use. The "never" list stops drift better than any "always" list.

**6. Voice rules for Copy.** Define, in five lines:

- **Register** (formal / conversational / blunt / warm).
- **Sentence length default** (short, mixed, long-flowing).
- **First person** (we / I / none).
- **Three banned words or phrases** specific to this brand.
- **One thing the brand never says** (a position, a posture, a claim).

Post all six outputs to `## Brand` in `TEAM_MEMORY.md` under a dated entry. Hand the voice-rules block to the Copy specialist explicitly.

## Decision rules

- **Two type voices, period.** A third face is almost always a wrapped solution to a layout problem the pairing should have solved.
- **The ownable hue must survive at 24px and at 24ft.** If it muddies at either end, it's wrong.
- **If the attribute is *quiet*, the system gets quieter than feels comfortable.** Most brands under-commit.
- **Recognizability beats prettiness.** Slightly-off-but-unmistakable beats polished-and-generic.
- **No mood boards without three pinned references.** "Clean and modern" without pictures is a discussion, not a brief.

## Anti-patterns

- Three or four typefaces because each is individually nice. The brand reads as a font store.
- Locking a palette before the price tier is set. *Premium* and *budget* look nothing alike.
- Borrowing an admired brand's system wholesale. You end up with their recognizability.
- Accessibility as a final-pass check. Contrast and minimum body size are first-pass constraints.
- Voice defined in adjectives ("friendly, smart"). Voice is rules — banned words beat mood words.
- Skipping the "never" list. Without it, every new asset drifts and brand decay starts.

## Before / after

**Brief:** *"We need a visual system. Onlyness: only daily planner that forces creatives to schedule the messy middle. Dominant attribute: unflinchingly honest."*

**Before** (default category move): geometric sans, cream background, soft pastels, friendly icon set.

**After** (system answering the attribute): slab serif display in near-black, mono for captions and timestamps, a single oxidized rust as the ownable hue against off-white, dense layout, no illustrations — only marked-up date grids. Voice rules: no exclamation marks, no "just," no future-tense aspiration. The system stops smiling, and the buyer recognizes the planner inside a thumbnail.