Company

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
    #FF0076



  • Blue
    #0496FF






  • Dark
    #151C2B



  • Dark Alt
    #1C263A



  • Medium
    #495772



  • Grey
    #8098C6



  • Sky
    #60BEFF



  • White
    #FCFCFC

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.

Do…
  • Tastefully use pink and blue fill colors counter-play on primary elements such as buttons.
Don’t
  • 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)

Do…
  • Apply a white fill to logo when used over images.
  • Apply good spacing around the logo around the logo.
Don’t
  • 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

Avatars

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






Typography

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

Heading
Sub Heading

Regular Text and a link

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

Questions?

Contact us at [email protected]