Brand & Style Guidelines

Design Philosophy

  • Minimalist
    Remove the unnecessary. When in doubt, cut it out.
  • Honest
    Quality design enhances trust.
  • Empathetic
    Visualize things as seen from the user’s perspective.
  • Distinct
    The Fiction brand should be distinct and easily recognizeable
  • Consistent
    The brand should be treated consistently across media.
  • Communicative
    Design for communication and ease of consumption.
  • Tranquil
    Let it breath. Use white-space and well placed visual emphasis.
  • Humble
    Don’t self reference. Don’t try to be clever or cute.

Brand Colors

  • Pink

  • Blue

  • Dark

  • Dark Alt

  • Medium

  • Grey

  • Sky

  • White

Pink vs Blue Counter-Play

A core aspect of the brand is the counter play between the primary pink and blue brand colors. We use this combination tastefully to create a powerfully distinct visual presentation although it must be used carefully.

  • Tastefully use pink and blue fill colors counter-play on primary elements such as buttons.
  • Don’t use pink and blue as text colors next two each other.
  • Don’t over use the pink vs blue, it can easily devolve into a loud and tasteless mess.

The Fiction logo is companies primary symbol. The logo acts as our signature and represents trust.

Download Logotype (SVG)
Download Pin (SVG)

  • Apply a white fill to logo when used over images.
  • Apply good spacing around the logo around the logo.
  • Manipulate the logos or imply false endorsement with Fiction
  • Colorize any part of the logo when used over images
  • Use any color other than the brand colors in the logo


The avatars associated with Fiction should just be the “pin” icon against a brand color background usually pink (#FF0076).


Fiction’s primary font is called Gibson.

We like it because it is light and simple and comes in a variety of weights and styles.

General suggestions for use:

  • Headings should be in semibold (600).
  • Regular text should be in regular weight (500).
  • Subheading can be in either light weight (300) or regular (500)
  • Links can be in semibold weight (600) to help them stand out

Sub Heading

Regular Text and a link

  • Use headings in a light weight
  • Ever use the ultra bold weight (800). Its fugly.


Contact us at [email protected]