This section explains the Dropbox colors, values, and how they’re used across our three main applications: See, Buy, and Use.


Tab is always Dropbox Blue

See Logo: Tab color for more information.

Color Buy TabColor

Accent color must be harmonious with content

See the Color: See for guidance on how to pair an accent color with content. 


Examples of successful photo/accent color pairings.

The background for a customer file is determined by the color of the text.

Color Buy AccentColor

If text is Coconut, customer file is placed on a Coconut background. If text is Graphite, customer file is placed on a Graphite background.

Color Buy HarmoniousContent

Examples of successful photo/accent color pairings.

If a headline appears on Graphite or Coconut, an accent color can appear behind the user content.

Color Buy HarmoniousContent2

When text appears on a Graphite or Coconut background, customer files can appear on a smaller background created with an accent color.

Color theming with accents 

Using color to visually “theme” groups of content is a great way to implicitly tie together a customer story. We have used it below to group the content of an entire page—because it’s all one continuous story—but it can be used in smaller modules to create content cohesion too.

Color Buy ThemingWithAccents2

This customer story is color-themed for a unified appearance.

More examples of color-themed customer stories.

Analogous colors for color theming.

Analogous colors for color theming.

Accent colors for orientation

Within a single page, accent colors can be used to differentiate pieces of content.


Accent colors for orientation

Use only one accent-color background per state or view of a page. For better harmony overall, be sure to use a base color between any two accent colors.

Color Buy AccentColorOrientation

Base colors for hierarchy

Tonal variation can indicate a clear hierarchy of content without causing visual distraction.


Color Buy Donts1

Don’t use Dropbox Blue as a background color color.

Color Buy Donts2

Don’t place accent colors next to each other.

Color Buy Donts3

Don’t use accent colored text on an accent colored background.