Brand guide

The name

The name is the address: applist.info. All lowercase, one word, with the .info, including at the start of a sentence.

• Write: applist.info, applist.info/mira
• Don't write: Applist, AppList, App List, applist, Applist.info

Wordmark

The wordmark is the name set in Host Grotesk Bold (700), tracked in slightly. Its period is drawn as a square: marker yellow on dark backgrounds, ink on light ones. It is live text, not an image, so it is always sharp and always the same.

• Smallest size: 13px. In the site header it is 28px; on phones, portfolio pages show the icon next to the address instead.
• Keep clear space around it at least the height of its “i”.
• Paper on Night with a yellow square, or ink on white with an ink square. No other colors, outlines, shadows or gradients.

Icon

Where the wordmark doesn't fit (browser tabs, home screens, avatars) the icon stands in for it: the a and the square period, on an ink tile.

• icon.svg, vector, rounded tile
• apple-icon.png, 180×180, square tile (platforms round the corners)
• favicon.ico, 16 and 32 px

Use the files as they are: don't redraw the letter, change the colors or move the square.

Color

applist.info is dark first: Night is the default, and light is a choice. The yellow is a highlighter, not a brand fill.

• Night #0e1011The page. Also the icon tile (#16191b).
• Paper #edeff0Text and the wordmark on Night.
• Marker #e1d644The square period, and behind text: one highlight at a time.
• Graphite #292c2eHairlines, borders and dividers.
• Muted paper #b4b8bbDescriptions and one-liners.
• Subtle paper #95999cLabels and mono meta.

Light theme: page #fdfdfe, ink #16191b, marker #f9f416. Text on the marker is always ink #16191b.

Type

• Host Grotesk for everything you read: Bold for the wordmark, SemiBold for headings, Regular and Medium for text and buttons.
• Commit Mono for things you could type or count: addresses, ids, versions, ratings, dates.
• Both are free under the SIL Open Font License.

The marker

The yellow marks what's worth noting, the way you'd run a highlighter over a word on paper: behind the text, never as the text color. One thing is marked at a time, and it moves to whatever you point at. The square in the wordmark is the same marker, at rest.

Lists for the apps you made.

Voice

One developer talking to another. Dry, specific and short. Real nouns (Play Console, TestFlight, README) instead of adjectives. No exclamation marks, and none of: unlock, elevate, seamless, supercharge, effortless, powerful, magic.

Please don't

• Capitalise or split the name, or drop the .info.
• Turn the square back into a round period, or put the yellow square on a light background (use ink there).
• Recolor, outline, stretch or rotate the wordmark or icon, or put them on busy photos.
• Use the marker yellow as text, as a large background, or on more than one thing at once.
• Use the name or icon in a way that suggests applist.info made, reviewed or endorses your app.

Linking to your page

Write the address as text, applist.info/yourname, or use the icon next to it. A verified checkmark confirms the name on a page only, not the apps on it (see the Terms).