Skip to content
Browse
Library

Bose. Coastal soundstage.

  • Commerce
  • Light theme
  • 10 colors
  • 2 typefaces

Bose — coastal soundstage pairs commanding, condensed display type with expansive fashion-editorial photography and quiet white retail surfaces. Near-black #131317 carries nearly all interface weight, while white and #f8f8f8 keep product cards, navigation, and purchase controls deliberately spare. Large 900-weight Bose Headline titles sit low over immersive imagery; compact Bose Text and hairline rules handle the dense commerce layer without competing with the product.

Visit bose.com
Screenshot of Bose
Captured from bose.com on October 11, 2026

Bose design system

Bose

Accent1

  • Inline learning links — a single electric-blue interruption in an otherwise monochrome retail interface

Neutrals9

  • Search and utility icon strokes, input text, and high-contrast micro-details

  • Primary text, navigation, icons, hairline borders, dark purchase fills, and inverse badges

  • Footer links, supporting links, and subdued utility text

  • Search placeholder and inactive input copy

  • Fine separators and low-emphasis form borders

  • Announcement-strip field, subdued controls, and inactive control treatment

  • Quiet secondary navigation and transitional surface bands

  • Product-tile surfaces, category controls, search field, and pale action surfaces

  • Page canvas, header and footer surfaces, image-overlay text, bordered purchase controls

Try a pairing

Pick any two colors from the palette to check whether text stays readable on top.

Aa

Soprano White on Chord Blue

5.33 : 1 contrast

Background
Text
  • Body textPasses AA 4.5
  • Large textPasses AA 3
  • StrictFails AAA 7

More DESIGN.md files. Same web, different personalities.