Everything visual and verbal about Really Focus, in one document. Open it, hand it to a designer, send it to a printer, post it on a Slack channel.
A solid REALLY, an outlined FOCUS, and the orange signature bar. Three components. One mark. Always together.
Leave whitespace around the lockup equal to the height of the "R". Never crop the orange bar. Never let other elements cross it.
Black on light, white on dark. The orange bar stays orange. There is no purple variant, no gradient lockup, no monochrome-orange version.
The wordmark is custom-drawn vectors, not live Inter. Don't try to recreate it with text — use the SVGs in logos/.
Wordmark: 80px wide on screen, 18mm in print. Below that, switch to the monogram. The orange bar must remain visible.
Black, white, and one signal orange. Greys exist as borders and hierarchy. If more than 5% of a layout is orange, it's wrong — orange is signal, not surface.
One typeface. Used at its heaviest weights. Negative tracking. ALL CAPS in headlines, eyebrows, and labels. Sentence case in body. No exceptions for "premium" feel.
We speak like a tactical operations manual, not a wellness app. Direct. Confident. A little dry. We're the chief of staff, not the cheerleader.
Sharp corners. Hard edges. No drop shadows except the orange hero glow. Buttons compress on click; hover changes colour, never position.
Signal Orange · 0px radius · uppercase · scale-95 on active
Transparent · 1px Steel Outline · uppercase
10% orange tint · 20% orange border · widest tracking
When in doubt, fall back to these. They are why Really Focus looks like Really Focus and not like every other SaaS landing page.
border-radius: 0 is the default. Buttons, cards, badges, inputs — square. Circles only for avatars, the favicon container, and pulsing status dots.
Signal Orange (#FF4F00) is the brand. The horizontal orange bar under the wordmark is its signature. When in doubt, draw an orange bar.
The palette is black, white, and orange. Greys exist only as borders or text hierarchy. Never use a tinted background to be "softer."
Headlines feel oversized. Hero scale clamps to 11vw. Section padding is 6rem vertical. Whitespace carries the design — don't fill it.
No drop shadows except the hero's orange-tinted glow. No gradients except mask fades. No illustrations. No 3D. No emojis. Material Symbols Outlined or Lucide icons only, kept thin.
Every asset referenced in this document lives in the brand_kit/ directory of the repo. Copy it, share it, fork it.