Brand Book // Issue 01
Official Style Manual & Brand Codex
Brisbane, Queensland, Australia • Edition 2026.1
Spec Ref: JR-002-SPH
Engineered by Spherify

Young.
Relaxed.
Refined.

The definitive design system and garment standard for Joy Ryder — tailored Australian streetwear cut specifically for the teen silhouette (ages 10–18).

Category Teen Boy Streetwear
Heritage Australian Coast
Demographic Boys 10–18 Years
Agency Architecture Spherify.com
01

Brand Essence & The Gap We Fill

Between Childhood Clothes and Adult Menswear

For decades, teen boys have been an afterthought in Australian retail. Once boys age out of primary school sizes, they are thrust into either juvenile department-store cuts or adult men's clothing that hangs awkwardly on their shoulders, hips, and waist.

Joy Ryder was created to eliminate that compromise.

The Three Pillars of Joy Ryder

1. Tailored Streetwear Drape Drop-shoulder tees and hoodies with refined chest and waist ratios that deliver an effortless skate silhouette without being sloppy.
2. Coastal Versatility (Ocean to Dinner) Garments engineered for versatility. Swim shorts with tailored side-adjusters that look just as sharp at a family dinner as they perform in the surf.
3. Uncompromising Construction Heavyweight 240gsm combed cotton, 4-way stretch twill, and stainless steel hardware that survive chlorine, salt, and countless wash cycles.
02

Trademarks & Identity System

Primary Trademark // Type A

The Blaze Wordmark

Features the signature retro surf star embedded at the center. Used on storefront headers, external signage, and primary brand communications.

Clear space: 1X height of the central star on all quadrants.
Garment Seal & Swatch Motif // Type B

The JR Star & Swatch

Used for internal damask neck labels, side-seam tabs, zipper pulls, and the PDP color selector.

JR Star Crest Woven Tab
Color Swatch
PDP Rule: Always use the 5-point star polygon for color option buttons.
03

Typography & Type Scaling System

Joy Ryder employs a structured three-tier typographic architecture engineered for teenage boys' streetwear. It pairs the bold, relaxed swagger of Australian coastal skate culture with crystalline mobile e-commerce legibility.

Primary Display Weights: 700 / 800 / 900

Cabinet Grotesk

Engineered by Indian Type Foundry. Confident, muscular grotesque proportions with relaxed curves. Used for hero covers, major chapter headings, collection banners, and primary 48px CTA buttons.

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789
Body & Interface Weights: 400 / 500 / 600 / 700

Plus Jakarta Sans

Modern geometric grotesque with warm humanist apertures. Guarantees high-speed readability across long product descriptions, patron conversion arguments, and mobile cart drawers.

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789
Technical & Telemetry Weights: 400 / 500 / 600

JetBrains Mono

Monospaced utility typeface for architectural dimensional callouts, production SKUs, dye TCX formulas, sizing measurement tables, and delivery tracking.

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789 (JR-SS25)
The 9-Step Modular Type Scale Ramp Ratio: 1.250 (Major Third) • Mobile Responsive
Display XL (Cover) 56px–88px • 3.5rem–5.5rem lh: 0.95 • ls: -0.03em
Young. Relaxed. Refined.
Display L (Hero Anchors) 36px–48px • 2.25rem–3.0rem lh: 1.05 • ls: -0.025em
Australian Coastal Streetwear
Heading 1 (PDP Title) 24px–30px • 1.5rem–1.875rem lh: 1.15 • ls: -0.02em
Aspen Tailored Swim Shorts
Heading 2 (Card Title) 20px–24px • 1.25rem–1.5rem lh: 1.20 • ls: -0.015em
240 GSM Ring-Spun Combed Cotton
Heading 3 (Feature Header) 18px • 1.125rem lh: 1.30 • ls: -0.01em
Marine-Grade Stainless Hardware & Hydrophobic Twill
Subhead (Lead Text) 16px • 1.0rem lh: 1.55 • ls: normal
Tailored specifically for the growing teenage boy's silhouette (ages 10–18). Drop-shoulder drape that drapes effortlessly without appearing baggy or sloppy.
Body (Primary Narrative) 14px • 0.875rem lh: 1.65 • ls: normal
Constructed from pre-shrunk ring-spun cotton that withstands vertical dryer shrinkage. Pre-washed with coastal softening enzymes to guarantee immediate all-day comfort straight out of the box.
UI & Button Trigger 12px • 0.75rem lh: 1.40 • ls: 0.08em uppercase
ADD TO CART • $99.95 AUD Minimum 48px tactile touch height
Telemetry & Metadata 10px–11px • 0.625rem lh: 1.20 • ls: 0.1em mono
SKU: JR-SS25-SWIM-01 • TCX 19-4024 • DISPATCH: 24H_BNE • QUALIFIED_AU_DELIVERY
04

Color Codex & Accessibility Matrix

Each tone represents an authentic element of the Australian coastal streetwear landscape. Click any swatch to copy its production hex value directly to your clipboard.

Deep Sea Navy
TCX 19-4024
#001837

Primary anchor: Swim shorts, winter fleece, body text, buttons.

Blaze Orange
TCX 16-1459
#FF4100

Signature pulse: Wordmark, CTA hover, drawcords, aglets.

Sand Cream
TCX 11-0604
#F0E9D1

Coastal neutral: Unbleached cotton jersey, header halos, trims.

Electric Lime
TCX 13-0550
#E3FF00

Youth contrast: Woven label logo crest, limited capsule tees.

Wave Navy
TCX 19-3938
#091C4C

Deep tide: Subtle background gradient layers, jacket lining.

Chalk White
TCX 11-0601
#FFFFFF

Store canvas: Crisp lookbook backdrop, variant pill base.

Semantic CSS Tokens & State Roles
--paper #FAF8F5 Warm coastal paper canvas
--paper-card #FFFFFF Surface cards, modals, sheets
--border-hairline rgba(0, 24, 55, 0.12) 1px structural component borders
--status-success #10B981 Free AU Delivery unlocked, in stock
WCAG 2.1 Accessibility & Contrast Validation
Deep Sea Navy on Sand Cream
13.8:1 (AAA Pass)
Chalk White on Deep Sea Navy
16.2:1 (AAA Pass)
Deep Sea Navy on White
17.5:1 (AAA Pass)
Blaze Orange on Navy (Headings/Badges)
5.1:1 (AA Large Pass)
05

Spatial Grid, Radius & Elevation Scale

The layout system is founded on a mathematically rigorous 8-point spatial rhythm with micro 4px half-steps. It governs component margins, touch target heights, and border radius hierarchy across all digital touchpoints.

8-Point Spatial Dimension Spectrum Base Unit = 8px • Sub-unit = 4px
4px
0.25rem Micro gaps, icon offsets
8px
0.50rem Stack gaps, badge paddings
12px
0.75rem Quick Add card anchor
16px
1.00rem Container padding, input gutters
24px
1.50rem Card padding, grid gutters
32px
2.00rem Major subsection margins
48px
3.00rem Standard CTA touch height
64px
4.00rem Section chapter vertical breaks
Corner Radius Standard (.rounded-*)
0px (rounded-none) Architectural Sharp Technical schematics, color blocks
4px (rounded) Quick Add & Inputs Search bar, form text inputs
8px (rounded-lg) Cards & Sheets Product cards, spec dossiers
9999px (rounded-full) Pills & Swatches Size selector pills, status chips
Elevation & Shadow Tokens
Elevation 0 // Flat Hairline border: 1px solid rgba(0, 24, 55, 0.12)
Card Base
Elevation 1 // Ambient Lift box-shadow: 0 1px 3px rgba(0, 24, 55, 0.06)
Product Card
Elevation 2 // Focused Hover box-shadow: 0 4px 14px rgba(0, 24, 55, 0.08)
Active State
Elevation 3 // Viewport Drawer box-shadow: 0 20px 40px -15px rgba(0, 24, 55, 0.18)
Cart Drawer
06

UI Component Library (Atoms & Molecules)

Every interactive control conforms strictly to a 48px minimum touch target height. Zero system emojis are permitted; micro-states utilize SVG hairline paths and high-contrast color transitions.

Button Spectrum (48px Height Standard) All CTA targets = h-12 / min-h-[48px]
Primary Action Default: Navy • Hover: Blaze
Secondary Action 1.5px Hairline Stroke
Accent Pulse CTA Fast-Track Buy Rail
State: Item Added 1500ms Active Feedback
State: Async Loading
State: Sold Out (Disabled)
Ghost Text Action
Size Pills (Touch Target Standard) 46px × 40px Touch Target

Active state fills with Deep Sea Navy. Sold out states apply diagonal hairline strikethrough.

Quantity Stepper & Star Swatches Custom Brand Atoms
1

5-Point star polygon clip-path applied to all color swatch variant buttons.

Form Fields & Check Controls
24H DISPATCH
Status Badges & Production Micro-Tags
In Stock • Brisbane Hub Low Stock • 2 Left in Size 14 240 GSM Ring-Spun Best Seller Recycled Poly Twill
07

Official Vector Iconography System

Zero-Emoji Protocol Enforced

System emojis are strictly prohibited across Joy Ryder digital platforms. All visual markers must use the official 1.75px–2.0px hairline SVG vector icon library.

Stroke: 1.75px • Grid: 24×24
01
jr-icon-bag
Shopping Bag
02
jr-icon-search
Search Loupe
03
jr-icon-user
Account Profile
04
jr-icon-heart
Wishlist Save
05
jr-icon-filter
Facet Sliders
06
jr-icon-menu
Mobile Drawer
07
jr-icon-box
Free AU Delivery
08
jr-icon-flash
24h Dispatch
09
jr-icon-swap
30-Day Returns
10
jr-icon-shield
Secure Checkout
11
jr-icon-pin
Brisbane Hub
12
jr-icon-star
Star Trademark
13
jr-icon-ruler
Size Codex
14
jr-icon-tee
Drop Shoulder
15
jr-icon-wash
30° Delicate
16
jr-icon-dryer
Line Dry Only
17
jr-icon-iron
Cool Reverse Iron
18
jr-icon-cotton
100% Organic
19
jr-icon-wave
Quick-Dry Twill
20
jr-icon-check
Unlocked / Valid
21
jr-icon-info
Tailor Fit Notice
22
jr-icon-arrow
Action Rail
23
jr-icon-chevron
Select Accordion
24
jr-icon-close
Modal Dismiss
08

Garment Craftsmanship & Engineering

Joy Ryder 240 GSM Signature Tee Editorial
SPEC 01 // TEXTILE

240 GSM Combed Cotton

Ultra-heavyweight 100% ring-spun combed cotton. Pre-shrunk to prevent vertical tumble shrinkage. Features drop-shoulder skate silhouette, high-density ribbed collar, and embroidered retro star pocket.

Jack (14yo, 163cm) wears Size 14 • Sand Cream
Joy Ryder Tailored Swim Shorts Lookbook
SPEC 02 // TECHNICAL SWIM

Tailored Swim Twill

90% Recycled Poly / 10% Spandex 4-way stretch twill with hydrophobic quick-dry finish. Tailored side adjusters with marine-grade stainless hardware — worn from the morning surf straight to lunch.

Jack (14yo, 163cm) wears Size 14 • Aspen Retro Print
Joy Ryder Heavyweight Fleece Hoodie Editorial
SPEC 03 // FLEECE

380 GSM Brushed Fleece

Substantial heavyweight fleece engineered for Australian winter evenings. Double-ply structured hood that stands up proudly, dropped shoulders, and embroidered retro star chest detail.

Jack (14yo, 163cm) wears Size 14 • Deep Sea Navy
09

Audience Dossier & Psychological Dynamic

The Commercial Patron

The Australian Mum

The Buyer

She holds the credit card and carries the mental load of dressing a boy whose body changes every six months. She has been burned by cheap fast-fashion brands whose shirts shrink in the dryer or develop bacon-necks after two washes.

What Converts Her:
  • Local Trust: Direct dispatch within 24h from Brisbane, Queensland.
  • Zero Risk: 30-day hassle-free return window and immediate size swaps.
  • Sizing Accuracy: Real age and centimeter measurements (Height, Chest, Waist).
  • Grow Room Advice: Sizing advice ("Size up for growing room with our relaxed drape").
  • Payment Flexibility: Afterpay, Apple Pay, Shop Pay for split payments.
The Cultural Protagonist

The Teen Boy (10–18)

The Wearer

He lives between the surf, the skate park, school holidays, and hangouts with friends. He has developed a sharp radar for "try-hard" or juvenile clothes. He refuses to wear anything that looks like his mum picked it from a department store rack.

What He Endorses:
  • The Drape: Authentic drop-shoulder, slightly boxy streetwear silhouette.
  • Subtle Cool: Clean typography, retro skate stars, refined graphic prints.
  • Peer Credibility: Clothes that his mates compliment at the beach or park.
  • Zero Itch: Tagless neck prints, soft brushed interior, seamless feel.
  • Versatility: Can go from morning surf straight to an afternoon café or dinner.
10

Sizing Master Matrix (Australian Boys 10–18)

Size Target Age Height (cm) Chest (cm) Waist (cm) Tailoring Notes
10 9–10 years 140–146 70–74 62–65 First transition out of kidswear; relaxed drop-shoulder cut.
12 11–12 years 147–156 75–80 66–69 Authentic skate drape with proportional sleeve length.
14 Core Benchmark 13–14 years 157–166 81–86 70–74 Model Jack's size (14yo, 163cm / 5'4"). Standard teen fit.
16 15–16 years 167–174 87–92 75–79 Longer torso line accommodating late-teen growth spurts.
18 17–18 years 175–182 93–98 80–84 Full young adult streetwear profile; equivalent to a relaxed Men's Small/Medium.
Tailor's Specification // Sizing & Fit Advice

If your boy is between measurements or growing fast, always size up. Joy Ryder pieces are intentionally designed with a drop shoulder that drapes cleanly when slightly oversized, guaranteeing your boy looks stylish now and still fits next season.

11

Digital Storefront Architecture

The Joy Ryder digital storefront prioritises editorial clarity over generic retail clutter. Product detail pages balance large-scale Australian coastal photography with a frictionless, tactile purchasing rail engineered specifically for parents and teen buyers.

Fig 11.1 // 3-Column Viewport Blueprint (Max 1440px) Desktop & Tablet
Col 1 Garment Dossier
• Editorial Story
• Fabric Specs
• Sizing Advice
• Dispatch ETA
Col 2 Visual Canvas
• 3:4 Aspect Hero
• Fit on Teen Model
• Macro Stitch Detail
• Hardware Closeups
Col 3 Conversion Rail
• Dynamic AU Delivery
• Star Swatch Select
• 48px Size Pills
• One-Click Checkout
Zero Layout Shift: Column 1 and Column 3 anchor sticky viewport positions while Column 2 scrolls fluid high-resolution imagery.
Micro-Conversion Triggers: Real-time free delivery qualification threshold ($100 AUD) updates instantly as items are adjusted in bag.
Touch-Optimized Hit Areas: All interactive pill selectors and primary CTA buttons conform to a minimum 48px tactile target.
Interactive Component Specimen

Aspen Tailored Swim Shorts

4-way stretch twill • Marine-grade stainless adjusters

$99.95
In Stock • Ready to Ship
Add $0.05 for Free Express AU Delivery
99%
Specimen State:
Size: 14 (Jack's Fit) Size Guide
Complimentary Express AU Delivery on orders over $100 AUD
Dispatched within 24–48 Hours from Brisbane fulfillment facility
30-Day Hassle-Free Returns & seamless teen size exchanges