Full Signal Media Brand Kit

Four corner brackets lock onto a red signal square inside a square outline. The outline is solid: Black on light grounds, White on dark grounds, never a tint. The horizontal lockup is the primary logo. The stacked lockup is secondary, for narrow or square spaces. The descriptor lockup adds “Programmatic media, fully managed” for introductions. Use the icon alone where space is square or tiny, and the wordmark alone only where the mark already appears nearby.

Horizontal lockup · primary

Stacked lockup · secondary

Icon centred above the wordmark. Use it where the horizontal lockup would get too small: square spaces, narrow columns, merch, signage. The horizontal lockup stays the default.

Descriptor lockup

Icon, wordmark and “PROGRAMMATIC MEDIA, FULLY MANAGED” in Geist Mono, uppercase and widely tracked, running the exact width of the wordmark. For decks, email signatures, event screens and introductions. Not to be confused with the tagline, “Clear Signal. Right Audience.”, which is set separately.

Icon

An app-tile version (Black square, reversed mark) is in logos/icon/tile/ for social and app use.

Wordmark · Geist Bold, outlined

Every variant ships as SVG (text outlined), transparent PNG (2000 px wide for the lockups and wordmark, 1024 px for the icon) and vector PDF.

Alternate: red outline

The same mark with the outline in solid Signal Red #FF2A1F. A secondary logo for moments that can carry more colour: merch, swag, campaign graphics, event backdrops. The primary logo stays the black / white outline everywhere else, including the website, documents and LinkedIn. Never place it on a red ground. Horizontal, icon, stacked and descriptor lockups, for light and dark grounds, as SVG, PNG and PDF in logos/alternate-red-outline/.

Clear space

Minimum sizes

Horizontal · 140 px widescreen minimum (mark ≈ 23 px tall)print minimum 30 mm wide

Stacked · 80 px widescreen minimumprint minimum 18 mm wide

Descriptor lockup · 240 px widebelow this the mono line gets too small to readprint minimum 50 mm wide

Icon · 24 pxscreen minimum for the full markprint minimum 8 mm

Below 24 px · bold faviconthe 16 px favicon is a bold, pixel-drawn versionnever shrink the full mark below 24 px

Wordmark · 100 px widescreen minimumprint minimum 22 mm wide

Do

Don’t

At 16 px the outline can’t survive, so the 16 px favicon is a bold version of the mark (heavier brackets, larger square, no outline), drawn pixel by pixel. From 32 px up it is the full mark with its solid white outline, with 32, 48 and 64 px hinted to whole pixels. favicon.ico holds 16, 32 and 48 px.

Full Signal Media×

New tab

HTML for the <head>

<link rel="icon" href="/favicon.ico" sizes="16x16 32x32 48x48">
<link rel="icon" type="image/png" sizes="16x16" href="/favicons/favicon-16.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicons/favicon-32.png">
<link rel="icon" type="image/png" sizes="64x64" href="/favicons/favicon-64.png">
<link rel="apple-touch-icon" sizes="180x180" href="/favicons/apple-touch-icon.png">
<link rel="manifest" href="/favicons/site.webmanifest">
<meta name="theme-color" content="#0A0A0A">

Mostly Black and White, with neutral grays for the crowd and structure. Signal Red marks what has been found: one focus per layout. Never use red for long text.

* CMYK values are approximate, converted mathematically from RGB with no colour profile. Always ask for a printer proof; match Signal Red to a proof, not to a screen. For large Black areas in print, ask the printer for a rich black.

Geist for everything people read; Geist Mono, set uppercase and tracked, for eyebrows, labels and data. Headlines are tight (−0.05em) and set solid. Both fonts are open source (SIL OFL 1.1) and bundled in fonts/.

Set in Geist 600 in the ink colour, with the pulsing square marker (core + outline box) to its left. The marker is the same one that finds people in the hero.

A red square core inside an ink outline box. The core breathes between full and half opacity and never switches off; a soft red halo grows and fades behind it. One shape everywhere: radar finds, the tagline, the callout dot and the phone eyebrow.

Colour

Core and halo Signal Red #FF2A1F · box in ink (--ink)

Opacity

Core 1.0 → 0.5 → 1.0 (never below 0.5) · halo 0.6 → 0

Timing

2.2 s loop · core ease-in-out · halo cubic-bezier(.2,.6,.35,1)

Reduced motion

Static: core at full opacity, no halo

/* Pulsing square marker: the core never switches off (opacity 1 -> .5 -> 1) */
.marker-core { fill: #FF2A1F; animation: fsm-breathe 2.2s ease-in-out infinite; }
.marker-box  { fill: none; stroke: currentColor; stroke-width: 2; }      /* --ink */
.marker-halo { fill: none; stroke: #FF2A1F; stroke-width: 2;
               transform-box: fill-box; transform-origin: center;
               animation: fsm-halo 2.2s cubic-bezier(.2,.6,.35,1) infinite; }
@keyframes fsm-breathe { 0%, 100% { opacity: 1 } 50% { opacity: .5 } }
@keyframes fsm-halo    { 0% { transform: scale(1); opacity: .6 } 75%, 100% { transform: scale(2.5); opacity: 0 } }
@media (prefers-reduced-motion: reduce) {
  .marker-core { animation: none; } .marker-halo { display: none; }
}

Live and animated, not screenshots: each frame below loads hero/index.html. One revolution finds ten of sixty, they hold and pulse, a clean reset, a fresh ten each cycle. The headline rotates through nine audiences (2.6 s each). The icon-only light/dark button sits at the far right of the nav: try it. Phones drop the radar, hide the button and stay light.

Desktop · light1440 × 800 canvas, scaled to fit

Desktop · dark?theme=dark, or the nav button

9:41

Hand-off

• hero/index.html + hero.css + hero.js: production-ready, no dependencies, fonts in hero/fonts/.
• Breakpoints are container queries on the page wrapper: ≥ 1024 desktop canvas, 601–1023 stacked tablet, ≤ 600 phone.
• Default light. The button sets <html data-theme>; label and aria-label switch (moon in light, sun in dark); red focus ring on keyboard focus.
• Reduced motion: the headline shows its first phrase and the radar holds the found frame.
• Embeds and QA: ?theme=dark · ?frame=found (freeze on the found state) · ?t=6.4.
• The “Capabilities” block under the hero is a demo stand-in for the next section; replace it.

Light / dark colour mapping

One design, light and dark: the logo, the tagline on one line, the descriptor under it, and the radar cropped at the right edge with a few found squares and the “Audience found” callout. Personal profile banner 1584 × 396; company cover 1512 × 256 (LinkedIn’s current spec) and 1128 × 191; each as PNG at 1x and 2x, plus SVG sources. On the profile banner the text, the found squares and the callout sit inside the phone app’s centre crop and clear of the profile photo on desktop and phone.

Light

profile banner · company cover · avatar

Your NameCo-Founder at Full Signal Media

Full Signal MediaAdvertising services

Dark

profile banner · company cover · avatar

Your NameCo-Founder at Full Signal Media

Full Signal MediaAdvertising services

Avatar / page logo · 400 × 400 and 800 × 800

Ryan’s page-logo design: the icon centred on White or Black. The mark fills 66 % of the tile (Ryan’s: 70 %) so the bracket corners stay inside LinkedIn’s circle crop.

Ryan’s original PNGs are kept, unchanged, in linkedin/ryan-originals/ for reference. Note: the file named “dark-company-cover” there is actually light (identical pixels to the white one); the true dark company cover is the one above.

Full contents, usage notes and the font licence: README.txt. A PDF of this page: brand-kit.pdf.