how we look, in one page

Brand

Social SDK is drawn by hand: an ink megaphone, one orange marker, and a serif that means it. Everything on this page is yours to download and use when you mention or embed Social SDK.

The mark

A stick-drawn megaphone with two marker strokes of signal. Use the ink version on paper and the cream version on ink. Don't redraw it, recolor it, or straighten it out; the wobble is the point.

Ink megaphone mark on paper
Mark, ink on paper download svgdownload png
Cream megaphone mark on ink
Mark, cream on ink download svgdownload png
Social SDK lockup, ink on paper
Lockup, ink on paper download svgdownload png
Social SDK lockup, cream on ink
Lockup, cream on ink download svgdownload png

clearspace: keep at least one megaphone-width of quiet around the mark ↑

Color

Ink on paper, then one marker. The orange is for signal only: waves, underlines, and the occasional annotation. If a layout has more orange than a margin note would, it's too much.

Ink#1c1a17text, strokes, borders
Paper#fffffflight background
Marker#e8542faccents, never body text
Soft ink#57534csecondary text
Night paper#131110dark background
Cream ink#f2efe9text and strokes on ink

Type

A real answer from every platform.

Fraunces carries headlines and body on marketing pages. Weights 380 to 640, tight tracking, never faux-bold.

margin notes go here →

Caveat is for annotations and asides only. If it's load-bearing information, it doesn't belong in the handwriting.

Docs run on Geist.

Geist and Geist Mono set the documentation UI, so product surfaces stay plain while the brand stays drawn.

client.publish(draft)

Monospace is reserved for code. Keep code samples in code style, not in the serif.

Using the brand

Please do

  • Use the mark or lockup as provided, at any size, on paper or ink backgrounds.
  • Write the name as two words: Social SDK.
  • Use these assets in articles, talks, integrations, and "works with" contexts.
  • Pick the cream variants whenever the background is dark.

Please don't

  • Recolor the megaphone or swap the orange for another accent.
  • Add gradients, shadows, outlines, or a container the mark didn't come with.
  • Stretch, rotate, or redraw the mark, or set the wordmark in another face.
  • Imply endorsement, or use the mark as your own app's icon.

questions? open an issue — the brand lives in the repo like everything else.