2.7Visual identityBasics
Patterns
Every STRIDE pattern is drawn from the wordmark. The strokes lean at 15.7°, the angle of the stem of the T, and they’re cut flat top and bottom the way the letters are. That’s what makes a box liner or a race bib feel like STRIDE before anyone reads the name.
There are six, two for each job. Pick by how loud the surface should be, use one per surface, and keep type off anything busy.
The set
Loud
For campaigns and race day. They carry the energy, so type never sits on them.
Lean
Speed dashes on the wordmark’s lean, cut flat top and bottom like the stem of the T.
Use for Campaign grounds, social, motion end frames, the shoebox lid.
Tile · SVG · 2.5 KB
Lanes
Eight track lanes and a staggered start, the outer lane furthest ahead.
Use for Race day: bibs, start-line banners, event pages, wayfinding.
Tile · SVG · 855 B
Working
For product and data. They can sit behind big numbers, tone on tone.
Splits
A stopwatch scale with every fifth tick long. The long ticks line up on the lean.
Use for App and data surfaces, training plans, product spec panels.
Tile · SVG · 1.4 KB
Contour
Topography, with a heavier index line every fifth contour, as on a trail map.
Use for Trail and outdoor ranges, maps, editorial pages, box liners.
Tile · SVG · 43.9 KB
Quiet
For things people hold and wear. Behind text only as a pale tint.
Vent
Laser-cut ventilation: short slots on the lean, set in a brick bond.
Use for Apparel prints, product page grounds, insoles and labels.
Tile · SVG · 808 B
Monogram
The wordmark in a brick bond, half a step over on every row.
Use for Tissue paper, packing tape, garment bags and box liners. Nothing else.
Tile · SVG · 3.7 KB
Colourways
Two colours, both from the palette: one for the drawing, one for the ground. These six pairs are the whole list. The contrast between the two sets how loud the pattern is, and only the two quietest pairs can have type over them.
- StrideBlue on StrideWhiteCampaign · 3.87:1
- StrideWhite on StrideBlueRace day and social · 3.87:1
- StrideWhite on Stride NavyNight and premium · 15.40:1
- Stride Navy on StrideOff-WhiteEditorial and packaging · 14.37:1
- StrideBlue on StrideBlue DeepTone on tone, behind big numbers · 1.81:1
- Stride Pale Blue on StrideWhiteTint, the only one behind text · 1.30:1
In use
Shoebox tissue. Monogram in Stride Navy on StrideOff-White, closed with the blue seal.
Race bib. Lanes in a band of StrideBlue, kept clear of the number.
App summary. Splits tone on tone behind the big number, fading out before the small type.
Social post, 4:5. Lean all round, the headline on a solid Stride Navy panel.
Scale and contrast
100% As drawn. The default everywhere.
50% The smallest. Lines are still a pixel or more.
Don’t:25% Too small. The strokes blur into a grey tint.
- Size it from the tile, not the surface. Scale a pattern up as far as you like; never take it below 50%.
- Keep type off loud patterns. Put headlines on a solid panel and let the pattern run around it.
- Tint before text. Behind body copy, use only Stride Pale Blue on StrideWhite. StrideBlack text still measures 13.6:1 where it crosses a stroke.
- One per surface, and never inside the logo’s clear space.
Do and don’t
Do:Run the pattern around a solid panel and set the headline on the panel.
Don’t:Don’t set a headline straight on a loud pattern. Neither can be read.
Don’t:Don’t rotate a pattern. The lean always matches the wordmark.
Don’t:Don’t layer two patterns on one surface.
Download
- All six patternsEvery tile as SVG in StrideBlack on transparent, with a note on tiling them in Figma and on the web.ZIP · 13.7 KB
- Lean tile448 × 400 px, repeats seamlessly. Loud.SVG · 2.5 KB
- Lanes tile320 × 320 px, repeats seamlessly. Loud.SVG · 855 B
- Splits tile70 × 500 px, repeats seamlessly. Working.SVG · 1.4 KB
- Contour tile640 × 400 px, repeats seamlessly. Working.SVG · 43.9 KB
- Vent tile36 × 48 px, repeats seamlessly. Quiet.SVG · 808 B
- Monogram tile144 × 88 px, repeats seamlessly. Quiet.SVG · 3.7 KB