// Brand

Brand Kit

Logos, colors and type for SyncVotes.

Logo

Three variants for different uses. The mark is an orange diamond ring with a ballot dot at its centre — the same geometry as the favicon and the app’s header.

Full logo
SyncVotes Full logo

Icon and wordmark lockup. Primary usage, on dark backgrounds.

Icon
SyncVotes Icon

For favicons, app icons and social avatars. The tile keeps it safe on any background.

Wordmark
SyncVotes Wordmark

Mark and name without the tile, for inline placements on dark surfaces.

Colour palette

Click a swatch to copy its hex value.

The app’s light theme deepens the accent and swaps warm black for bone; the mark keeps its orange.

Typography

Five typefaces, one hierarchy: a display face, a body face, a mono for labels, and two serifs for accents.

Headings & titles
Syne

Headings, titles, the brand name. Display sans with personality.

SemiBold · 600
Aa Bb Cc 123
Bold · 700
Aa Bb Cc 123
ExtraBold · 800
Aa Bb Cc 123
Body text
Inter

Body text and descriptions. Optimised for screen readability.

Regular · 400
Aa Bb Cc 123
Medium · 500
Aa Bb Cc 123
SemiBold · 600
Aa Bb Cc 123
Code & labels
JetBrains Mono

Code, labels, party IDs. Sharp and technical.

Regular · 400
Aa Bb Cc 123
Medium · 500
Aa Bb Cc 123
Bold · 700
Aa Bb Cc 123
Editorial accents
Instrument Serif

Pull-quotes and editorial moments. Single weight, roman and italic.

Regular · 400
Aa Bb Cc 123
Landing italics
Newsreader

The landing’s italic accents, heavier than Instrument Serif at display sizes.

Regular · 400
Aa Bb Cc 123
Medium · 500
Aa Bb Cc 123

Usage guidelines

Follow these rules to keep the SyncVotes brand consistent and recognizable.

Do
  • Use the logo on dark backgrounds (#0b0a08 or darker)
  • On a light surface use the tile, or the bare mark with the surface’s own ink for its dot — as the app does in its light theme
  • Maintain clear space around the logo
  • Use the color values exactly as given
  • Keep surfaces flat — hairline rules, square corners, pill buttons
Don’t
  • Don’t set the lockup files on light or white backgrounds
  • Don’t rotate, distort or add effects to the logo
  • Don’t change the logo colors
  • Don’t add gradients, glows or mesh overlays