logocene

Sunday Current brand guidelines

Sunday Current
TypeAI pick
Fraunces / Inter
ColourAI pick
sunday-current-3.
people inside cafe
Brand guidelinesVersion 1.0

Coffee and breakfast, unhurried

Food & Drink
Sunday CurrentChapter 01

Brand

The name, the line, and how to use this guide.

01.1 Overview

About Sunday Current

This guide sets out how the Sunday Current identity works: the logo, colour, typography and how they come together.

Follow it and everything, from a business card to a website, looks like it came from the same place.

Start with the logo, then colour and type, before any layout.

Coffee and breakfast, unhurried

Name
Sunday Current
Category
Food & Drink
Typefaces
Fraunces and Inter
Palette
Sunday current 3
Sunday CurrentChapter 03

Colour

The palette, the values, and which combinations to set type in.

03.1 Colour

Palette

Five colours, used in roughly these proportions. Surface sets the page, primary carries the brand, ink is for text, and secondary and accent support and highlight.

Surface
#F2F2F2
38%
Primary
#2C2B2C
24%
Ink
#2C2B2C
14%
Secondary
#D9D9D9
13%
Accent
#858485
11%
03.2 Colour

Colour values

Use HEX or RGB on screen. CMYK values are approximate conversions: print colour depends on the press and the paper, so ask your printer for a proof.
  • Primary
    HEX
    #2C2B2C
    RGB
    44, 43, 44
    HSL
    300, 1%, 17%
    CMYK
    0, 2, 0, 83
    On surface 12.6:1 · AAA
  • Secondary
    HEX
    #D9D9D9
    RGB
    217, 217, 217
    HSL
    0, 0%, 85%
    CMYK
    0, 0, 0, 15
    On surface 1.3:1 · shapes only
  • Accent
    HEX
    #858485
    RGB
    133, 132, 133
    HSL
    300, 0%, 52%
    CMYK
    0, 1, 0, 48
    On surface 3.3:1 · large text only
  • Surface
    HEX
    #F2F2F2
    RGB
    242, 242, 242
    HSL
    0, 0%, 95%
    CMYK
    0, 0, 0, 5
    Ink on it 12.6:1 · AAA
  • Ink
    HEX
    #2C2B2C
    RGB
    44, 43, 44
    HSL
    300, 1%, 17%
    CMYK
    0, 2, 0, 83
    On surface 12.6:1 · AAA

03.3 Colour

Tints

Tints mix each colour toward white, for backgrounds, borders and charts. Shades, on the rows below, mix toward black and stop short of it. Keep text on a step that passes contrast.
Primary
100#2C2B2C
80#515051
60#797879
40#A4A3A4
20#D0D0D0
10#E7E7E7
Secondary
100#D9D9D9
80#E1E1E1
60#E8E8E8
40#F0F0F0
20#F7F7F7
10#FBFBFB
Accent
100#858485
80#9C9B9C
60#B4B3B4
40#CCCCCC
20#E5E5E5
10#F2F2F2
Surface
100#F2F2F2
80#F5F5F5
60#F7F7F7
40#FAFAFA
20#FCFCFC
10#FEFEFE
Ink
100#2C2B2C
80#515051
60#797879
40#A4A3A4
20#D0D0D0
10#E7E7E7
Ink shade
100#2C2B2C
80#2A292A
60#282828
40#272627
20#252425
10#232323
Primary shade
100#2C2B2C
80#2A292A
60#282828
40#272627
20#252425
10#232323
03.4 Colour

Colour pairings

Body text needs a contrast of at least 4.5:1 (AA). Large headings, 24 px and up, can go down to 3:1.

Pairs marked ✕ are for shapes and decoration only, never for text.

Contrast of each palette colour as text (columns) on each palette colour as background (rows)
BackgroundPrimarySecondaryAccentSurfaceInk
OnPrimarySame colour
Secondary on primary: 10.0
Accent on primary: 3.8
Surface on primary: 12.6
Ink on primary: 1.0 , fails
OnSecondary
Primary on secondary: 10.0
Same colour
Accent on secondary: 2.6 , fails
Surface on secondary: 1.3 , fails
Ink on secondary: 10.0
OnAccent
Primary on accent: 3.8
Secondary on accent: 2.6 , fails
Same colour
Surface on accent: 3.3
Ink on accent: 3.8
OnSurface
Primary on surface: 12.6
Secondary on surface: 1.3 , fails
Accent on surface: 3.3
Same colour
Ink on surface: 12.6
OnInk
Primary on ink: 1.0 , fails
Secondary on ink: 10.0
Accent on ink: 3.8
Surface on ink: 12.6
Same colour

Swipe for more

Sunday CurrentChapter 04

Typography

The two typefaces and the sizes they are set at.

04.1 Headings

Fraunces

Fraunces sets the name, headlines and short display lines. Use it at Semibold with tight line spacing.

Fraunces on Google Fonts (opens in a new tab)

SIL Open Font License 1.1. Free for commercial use, including in logos, apps and print.
Semibold 600
04.2 Text

Inter

Inter is for paragraphs, captions, buttons and anything people read at length. Use it at Regular, with generous line spacing.

Inter on Google Fonts (opens in a new tab)

SIL Open Font License 1.1. Free for commercial use, including in logos, apps and print.
Regular 400

Coffee and breakfast, unhurried. Sunday Current writes in Inter: clear, even and easy to read, from the first line of a website to the small print on a receipt.

04.3 Typography

Type scale

Five sizes cover almost everything. Each step is roughly 1.4 times the one below it; do not add sizes in between.
Display
Fraunces 600 · 56/67
Coffee and breakfast, unhurried
Heading
Fraunces 600 · 40/50
Welcome to Sunday Current
Subheading
Fraunces 600 · 28/32
A short section heading
Body
Inter 400 · 16/24
Body text at 16 px with 1.5 line spacing keeps long reads comfortable on any screen.
Caption
Inter 400 · 12/17
Captions, labels and small print
Sunday CurrentChapter 05

Graphic elements

Icons, a pattern, and the photography to aim for.

05.1 Graphic elements

App icon and avatar

Where space is small and square, use the symbol alone. On app icons it sits on primary at a little over half the icon width; on avatars and profile pictures, on surface.

iOS · 1024 px
Android · adaptive
Avatar · 400 px
Sunday Current
sundaycurrent.com
Favicon · 32 and 16 px

05.2 Pattern

Symbol upright on an offset grid, mirrored on alternate columns. For packaging, backgrounds and merchandise, never behind text.

05.3 Graphic elements

Imagery

Natural light, real places and real people. Keep rooms neutral and let brand colour appear on one object or a single overlay.

Photos here are samples from Unsplash, to show the direction.

Sunday CurrentChapter 06

Applications

The identity on a screen, on paper, and in a place.

Campaign

round brown wooden tables beside black leather sofa
Campaign · photography
06.2 Applications

Digital

On screen the logo sits in the corner, small, and the brand colour is reserved for one action.
Website · 1440 desktop
Instagram post · 1080 × 1350
06.3 Applications

Print

In print, keep the clear space and stay above the minimum size. The card is 85 × 55 mm; the letterhead is A4.
Business card · 85 × 55 mm
Letterhead · A4
06.4 Applications

In the world

Outdoors and on a product, the logo is one element among the photograph. The room stays neutral.
Poster · in situ
Label · packaging
Your turn

Make one like this

This is an example brand. Describe your business to explore nine logo concepts, each with colours, fonts and a guide like this one. Your first watermarked preview is free; download credits start at $9.99 for 10.

  • Logo symbolSVG in colour, black and white
  • Logo symbolPNG at 512, 1024 and 2048 px
  • palette.json, palette.cssThe five colours as code
  • FONTS.txtBoth typefaces, with links
  • LICENSE.txtCommercial use for your brand
Make mine like this

Sample photos by Petr Sevcovic, 99.films, Robert Bye, Caramel, Phil Desforges, OhTilly, Oguz Tombul on Unsplash. Not included in the download.