Boardwalk
BoardwalkBrand Guidelines 2026
01 / 12

Brand Guidelines
2026

Community-centered, fee-protected economies
Use or click the arrows to navigate

BoardwalkCustom Wordmark

BOARDWALK wordmark on Papaya Whip
  • Modified “Satoshi — Black Italic” with custom strikethrough styling.
  • All letters in the wordmark are equal height except “O”.
  • LRTB padding is the width of one “B”.

If typing it out

Usage
Display, Large Ideas, Kinetic Text
Size
96px
Tracking
-6%
Line height
84
Case
Caps Lock
Download all variants (.zip)

LogoAvatar — for social platforms

Avatar — white on blue
Avatar — blue on white
Avatar stroke — white on blue
Avatar stroke — blue on white
  • Width of the whale is ¾ of the width of the container it lives in.
  • Use this for social media platforms — the square version, not the circle variants.
Download all variants (.zip)

LogoCircle — not for social avatars

Circle — white on blue
Circle — blue on white
Circle stroke — white on blue
Circle stroke — blue on white
  • No stroke: width of whale is ¾ of the container.
  • Stroke: width of whale is of the container.
  • Stroke of the circle (if any) is 1/25 of the width.
  • Not for social media platforms — it will crop.
Download all variants (.zip)

Logo with WordmarkHero — Variant A

Boardwalk hero lockup on Papaya Whip
  • The “B” in BOARDWALK is the unit of measure.
  • Padding LR is the width of one “B”.
  • Padding TB is half the width of one “B”.
  • Whale is 2 ⅓ the height (7 units) of one “B”.
  • Variant A is suited for large use — hero sections, etc.
Download all variants (.zip)

Logo with WordmarkNavigation — Variant B

Boardwalk navigation lockup on Papaya Whip
  • The “B” in BOARDWALK is the unit of measure.
  • Padding LR is the width of one “B”.
  • Padding TB is half the width of one “B”.
  • Whale is 1 ⅔ the height (5 units) of one “B”.
  • Variant B is suited for small use — menu bars, etc.
Download all variants (.zip)

Logo with WordmarkStacked

Stacked logo on cream
  • The “B” is the vertical unit of measure.
  • Padding LRTB equals the height of one “B”.
  • Width of whale is 7/12 of the BOARDWALK wordmark.
  • Grid is 5 “B” high, 1 wordmark wide.
  • Whale anchors to the top; wordmark anchors to the bottom.
  • All letters equal height except “O” — do not anchor “O”. Use “B”, not “O”, to anchor.
Download all variants (.zip)

Boardwalk ColorsPrimary

Brick Red

Primary hero-logo red. Use extremely sparingly as an accent. Also the primary accent line color — lines 1/2/4px, never over 8px; the opposite axis fills its container.

Deep Space Blue

Primary blue. Backgrounds, text, buttons — can live anywhere. Functions as Boardwalk’s version of black.

Papaya Whip

Primary white. Use liberally for backgrounds, text, buttons. Functions as Boardwalk’s version of white.

Steel Blue

Primary alternative blue. Buttons, highlights, text. Reach for it when Deep Space Blue is too dark; great for accents on ocean waves.

Molten Lava

Not an accent — Boardwalk’s fill color when red is needed in an all-consuming way. A subdued red suited for larger red panels.

Boardwalk ColorsSecondary

Gunmetal

Secondary color, used mainly in iconography in place of shadow and accents.

Grey

Secondary color, also used mainly in iconography in place of shadow and accents.

Pale Slate

Used when Papaya Whip is too bright. On Boardwalk, mostly used in iconography.

Baltic Blue

Secondary blue. Dropdown menus, card accents; works well as a fill for evening / sunset art.

Charcoal Blue

Secondary blue with a grey tint. Primarily used as a fill for text fields.

Boardwalk ColorsSuccess / Alerts / Candles

Jungle Green

Success color. Also the green candlestick in trading charts.

Lobster Pink

Alert / warning color. Also the red candlestick in trading charts.

  • These colors are never used unless you are showing success, alerts, green trading candles, or red trading candles.
  • Do not use these colors unless you have a situation that calls for it.

Boardwalk ColorsGreyscale

Black

White

Grey

  • Black & White / Greyscale should never be used on native branding.
  • The only use case is third-party websites that require a black / white / grey palette.
Greyscale stacked logo
Greyscale wordmark

Boardwalk FontsHero, header & body

Display · Large ideas · Kinetic textSatoshi — Black Italic

96px · -6% tracking · 84 line-height · Caps Lock
Download Satoshi ↗

Sub-display · Large idea sub-textSatoshi — Light Italic

96px · -6% tracking · 84 line-height · Caps Lock
Download Satoshi ↗

Header textPlus Jakarta Sans — Bold

48px · -3% tracking · 48 line-height
Download Plus Jakarta Sans ↗

Sub-header · NavigationPlus Jakarta Sans — SemiBold

24px · -4% tracking · auto line-height · Caps Lock
Download Plus Jakarta Sans ↗

Body textManrope — Light · the quick brown fox

14px · 0% tracking · auto line-height
Download Manrope ↗

Buttons · Links · EmphasisManrope — Medium · the quick brown fox

14px · 0% tracking · auto line-height
Download Manrope ↗