Styleguide

Brand system

Fonts, tokens and atoms shared by every Play Company destination. Link /v1/play.css, then build from what's on this page.

Color · foundation
black#000000 · the stage
surface-1#0E0F11 · proposed
surface-2#181A1D · cards
surface-3#22252A · proposed
ink#E6F1FF · text
white#FFFFFF · emphasis
ink-270% · secondary
ink-335% · tertiary
ink-420% · tag fill
line14% · dividers
Color · accent and thermal
blue#1264CF · primary action
blue-hover#1A74E8
red#FF3B3B · proposed

Thermal (proposed) is an image color for key art only. Never UI.

Typography
Player Expanded
.p-display
It pays to play
Player Expanded
.p-headline
Tip-Off Series
Player Condensed
.p-heading
Road to the Final
Player Condensed
.p-title
Friday Night 2K Showdown
Player Condensed
.p-label
Prize pool · Essential benefits
Nuber Next
.p-lead
Skill-based NBA 2K and Madden NFL tournaments with real cash prize pools.
Nuber Next
body
Register in the PlayOS app, compete against players at your level, and get paid out instantly when you place.
Azeret Mono
.p-meta
Oct 21 – Nov 21, 2026 · 1v1 · Registration opens Oct 5
Azeret Mono
.p-mono
Get the app · Join waitlist
Numerals
.p-num
$2,500#104:59
Buttons
Get the app All prizes Start free trial
Get the app View schedule

Pill (.p-btn) for nav and in-card actions. CTA (.p-btn--cta) for the main action on a page, panel or email.

Tags
NBA 2K Madden NFL PlayPass Live
Cards

Friday Night 2K

NBA 2K8:00 PM PT$10 entry
$2,500Prize pool

Madden Sunday Classic

Madden NFL1:00 PM PTPlayPass
$10,000Prize pool
Interactive card
.p-card--interactive · hover me
.p-notice · Showing sample tournaments while the live list loads.
Steps · badge and rows card
  1. 1
    Download PlayOS

    Get PlayOS from the App Store.

  2. 2
    Create your account

    Sign up and verify your identity.

  3. 3
    Register for a qualifier

    Find the Tip-Off Series in the Compete tab.

EventDatePrize pool
Qualifier 110/21$10K
Online Playoff11/14—
In-Person Final11/21$25K
Layout
--p-width-read · 656 · reading column
--p-width-list · 856 · card list

Gutter 16→24 (--p-gutter) · nav bar 64 (--p-nav-h) · frame 8→16 (--p-frame, proposed). Rhythm: 12 headline→lead, 24 copy→buttons, 32 around key art, 48 between sections, 8 between cards.

Tabs (proposed)
Motion
--p-ease-out · --p-dur-4
--p-ease-in-out · --p-dur-4
Logo
P mark, ink

p-mark.svg

P mark, white

p-mark-white.svg

P mark, black

p-mark-black.svg

Favicon

favicon.svg