Thumbkiss
brand assets

01 The mark

Logo

A single continuous line that spirals like a fingerprint and closes into a heart, drawn on a 512 × 512 grid with a uniform stroke and rounded terminals. Red is the default. White is for photography, video and dark surfaces. Black is for single colour print.

02 Logo with text

Lockups

Use a lockup where the symbol alone would not be recognised: app stores, press articles, partner pages, sponsor walls. The wordmark is set in General Sans Semibold at −1.2% tracking and drawn as outlines, so it never depends on a font being installed.

Reach for the two tone horizontal version by default. Switch to single colour when the layout already carries another accent, when you print in one ink, or when the logo sits beside other partner logos. Use the stacked version only in roughly square space.

Horizontal

Stacked and wordmark

03 Share it

Badges

If you build something with Thumbkiss, use it with your partner, or write about it, these are yours. Put one on a screenshot, a photo, a story, a website footer or a README. Eight messages in four shapes, each in four styles: dark, light, Thumbkiss Red and a white outline that sits on any photo.

Pill

Sticker

Square stamp

Chip

All 76 badges, stickers, stamps and chips are in the kit. Link them back to thumbkiss.app wherever the medium allows links, and please do not edit the text or make your own variation.

<a href="https://thumbkiss.app" target="_blank" rel="noopener">
  <img src="https://thumbkiss.app/brand/thumbkiss-badge-created-on-dark.svg"
       alt="Created on Thumbkiss" height="34">
</a>

[![Created on Thumbkiss](https://thumbkiss.app/brand/thumbkiss-badge-created-on-dark.svg)](https://thumbkiss.app)

04 Product

App icon

The icon that ships on the App Store and Google Play. Do not add your own rounded corners to the 1024 × 1024 master, because iOS and Android apply their own mask. Thumbkiss also ships alternate in app icons (Default, Gold, Diamond, Legend, Premium, LDR). Those are product features, not public brand assets.

Property	Value
Master size	1024 × 1024 px
Background	#FFFFFF, fully opaque
Mark colour	#FF2E57
Mark width	73.9% of canvas
Corner radius	None, applied by the OS
Colour profile	sRGB IEC61966‑2.1
Web tile radius	22.37%

05 Construction

Clear space

Keep a clear margin around the logo equal to 25% of the mark height on every side. Nothing enters that margin: no text, no other logos, no photo edge, no interface chrome.

Context	Minimum size
Symbol on screen	24 px height
Symbol in print	8 mm height
Horizontal lockup on screen	96 px width
Horizontal lockup in print	28 mm width
Stacked lockup on screen	64 px width
Pill badge on screen	28 px height
Favicon or avatar	Use the red tile

Below 24 px the inner spiral fills in. If you need the logo smaller than that, use the red tile, which is drawn to survive it.

06 Rules

Do and don’t

07 Colour

Palette

Thumbkiss Red is the one colour that has to be right. Everything else is a supporting neutral. Click a swatch to copy its hex.

Neutrals

08 Type

Typography

Two typefaces with separate jobs. General Sans is the brand and product face. It draws the wordmark and every pixel of the iOS and Android apps. Fraunces is the editorial face, used only for large headlines on the website and blog. Never swap their roles, and never add a third family.

Scale

09 System

Tokens

Spacing runs on a 4 px base. Radii are named by role rather than by pixel value, so a component keeps its personality when it is resized. Copy the CSS below, or take the tokens JSON.

:root {
  /* colour */
  --tk-red-500: #FF2E57;   /* Thumbkiss Red, the brand colour */
  --tk-red-600: #E31048;   /* text safe red on white, 4.74:1 */
  --tk-ink:     #0B0A0A;
  --tk-night:   #080604;

  /* type */
  --tk-font-brand:   'General Sans', 'Helvetica Neue', Arial, sans-serif;
  --tk-font-display: 'Fraunces', Georgia, serif;

  /* space, 4px base */
  --tk-sp-1: 4px;  --tk-sp-2: 8px;  --tk-sp-3: 12px; --tk-sp-4: 16px; --tk-sp-5: 24px;
  --tk-sp-6: 32px; --tk-sp-7: 48px; --tk-sp-8: 64px; --tk-sp-9: 96px; --tk-sp-10: 128px;

  /* radius */
  --tk-r-sm: 8px; --tk-r-md: 14px; --tk-r-lg: 22px; --tk-r-xl: 32px; --tk-r-pill: 999px;

  /* motion */
  --tk-motion-fast: 160ms ease-out;
  --tk-motion-base: 240ms cubic-bezier(.2,.8,.2,1);
}

10 Legal

Usage

The Thumbkiss name, logo, badges and app icon are trademarks of Thumbkiss. You may use the assets on this page, unmodified, to refer to the Thumbkiss app in editorial articles, reviews, app directories, comparison pages, social posts and academic work. You may not use them to suggest endorsement, to brand your own product, or as part of another logo. Questions go to hello@thumbkiss.app.