Branding & Style Guide

The InterlinedList brand is the logo mark: the interlocked knot symbol on its own. There is no wordmark or tagline. Every asset in this guide is the symbol only, so it reads cleanly at any size from a 16 × 16 favicon to a 512 × 512 app icon.

Download Assets

Download the complete brand kit (ZIP, ~170 KB)

The ZIP contains every file listed below: all icon-mark sizes, all background variants, and the SVG source files.

---

Icon Mark: Individual Downloads

The square logo mark at every standard size. The full-colour variant uses the three brand colours on a transparent background. The white variant is a single-colour knockout, suited to dark or coloured backgrounds.

Filenames use dark for the full-colour mark and light for the white knockout, matching the naming used across the rest of the kit.

Transparent background: full-colour mark

Transparent background: white knockout (for dark surfaces)

On solid backgrounds

The mark is pre-composited onto each background, so no compositing is needed. White and Ocean Blue backgrounds use the full-colour / white knockout that reads best against them.

---

SVG Source Files

Vector files that scale to any size without quality loss. Each contains the logo mark only (the interlocked knot symbol, no text).

For a raster version at a fixed size, use the PNGs in the Icon Mark tables above.

---

Logo Previews

Primary logo mark

This is the logo. Use it wherever the InterlinedList mark is needed.

InterlinedList primary logo mark

Logo mark: white knockout (on transparent)

InterlinedList logo mark, white knockout, 256px

Logo mark: on white background

InterlinedList logo mark on white, 256px

Logo mark: on black background

InterlinedList logo mark on black, 256px

Logo mark: on Ocean Blue background

InterlinedList logo mark on Ocean Blue, 256px

---

Brand Story

InterlinedList is a social list-management and cross-posting platform built around the idea of layers: lists within lists, connections between ideas, meaning threaded through everything. The name "Interlined" captures that spirit: content and structure woven together, not stacked on top of each other.

The logo mark distils this into a single symbol: an interlocked knot whose strands cross over and under one another, separate lines that stay connected. It carries the whole identity on its own, which is why the brand leads with the symbol rather than a wordmark.

The palette draws from two overlapping worlds. Ocean Blue comes from deep-sea exploration: depth, calm, and discovery. Emerald Green brings in lush natural growth: momentum, freshness, and life. Amber Gold ties them together as the warm highlight that catches your eye and invites action.

Together these colours say: this is a thoughtful, organised, purposeful place to create.

---

Logo Assets

Primary Logo Mark

This is the canonical logo. Whenever you need the InterlinedList logo (app icons, favicons, social avatars, navigation bars, or any context where the mark stands), use the logo mark. It is the interlocked knot symbol rendered in the three brand colours: Ocean Blue (#0F4C5F), Emerald Green (#34A56D), and Amber Gold (#F9AF36), on a transparent background. There is no wordmark or tagline.

• Vector (preferred): logo-mark.svg scales to any size.
• White knockout: logo-mark-white.svg for dark or coloured surfaces.
• Raster: the icon-* PNGs in the Icon Mark tables, at every standard size.

Do not substitute a screenshot, re-export from another source, or derive a new version. Use the provided files as-is.

Choosing a variant

---

Logo Usage Rules

Do:

• Use the logo mark as-is in all app, web, and product contexts. It is the canonical file.
• Use logo-mark.svg (full colour) on light/white backgrounds.
• Use logo-mark-white.svg (white knockout) on dark or coloured backgrounds.
• Give the mark breathing room: leave clear space around it equal to roughly one-quarter of the mark's height on every side.
• Scale proportionally: hold shift when resizing to avoid distortion.

Minimum size:

Below 24 px, prefer the dedicated small favicons (16 × 16, 32 × 32) which are tuned for tiny sizes.

Do not:

• Recolour the logo. Use only the provided files as-is.
• Add the wordmark, product name, or a tagline back onto the mark. The brand is the symbol alone.
• Stretch, skew, rotate, or distort the logo in any direction.
• Apply drop shadows, glows, outlines, or other effects.
• Place the logo directly against a background that makes it hard to read (low contrast, busy patterns, clashing colours).
• Place another brand's logo immediately adjacent to the InterlinedList logo without clear visual separation between them.

---

Brand Colors

Core logo colours

Extended palette (Darkone theme)

Dark mode background stack

Hero gradient

• Start: #667EEA
• End: #764BA2

This gradient works well for event banners, social media headers, and email header backgrounds where you want to evoke the InterlinedList landing experience.

---

Typography

InterlinedList uses the Play typeface (available free from Google Fonts at fonts.google.com). Play is a clean, modern geometric sans-serif with a slightly technical character that complements the platform's data-forward personality without feeling cold.

The logo mark itself carries no type, but Play is the brand voice everywhere text appears: headings, display copy, and UI.

Using Play in your own content:

1. Visit fonts.google.com/specimen/Play.
2. Click Get font, then Get embed code.
3. Paste the provided <link> tag into the <head> of your HTML, or download the font files for desktop publishing tools.

For non-web contexts (presentations, print, video thumbnails), any clean geometric sans-serif such as Roboto, Inter, or Nunito reads similarly well as a stand-in when Play is not available.

---

The Darkone Theme

InterlinedList's interface is built on the Darkone v1.0 Bootstrap admin theme. Understanding the theme helps community developers build tools and extensions that feel visually consistent with the platform.

Key characteristics of the theme:

• Deep, layered dark backgrounds designed to reduce eye strain during long sessions.
• High-contrast text against those backgrounds for comfortable reading.
• A consistent layout architecture: top navigation bar, collapsible sidebar, and content cards.
• Smooth transitions and subtle gradients throughout interactive elements.

If you are building a community tool or integration and want your UI to feel native to InterlinedList, the dark background stack in the Brand Colors section above gives you the colour values you need.

---

Branding Package for Partners

The complete kit is available as a single download:

Download interlinedlist-brand-kit.zip (~170 KB)

What is included:

interlinedlist-brand-kit.zip
  icon/
    icon-dark-transparent-{16,32,64,128,180,192,256,512}.png   full-colour mark
    icon-light-transparent-{32,64,128,180,192,256,512}.png     white knockout
    icon-on-white-{64,128,256,512}.png
    icon-on-black-{64,128,256,512}.png
    icon-on-ocean-{64,128,256,512}.png
  svg/
    logo-mark.svg          full-colour mark (vector)
    logo-mark-white.svg    white knockout (vector)

Every file is the logo mark only: no wordmark, no tagline. If you need a custom size or format not listed here, reach out through the InterlinedList contact page.

---

CSS Custom Properties Reference

If you are building a community theme, browser extension, or embedded widget that should feel consistent with InterlinedList's visual design, the following CSS custom properties are what the site uses internally.

Light theme (default)

Dark theme ([data-theme="dark"])

---

Dos and Don'ts

Do:

• Use the logo mark as the canonical logo. It is the definitive InterlinedList symbol.
• Use the provided logo files as-is. Do not recreate the mark by hand.
• Match the variant to the background (full-colour logo-mark.svg on light surfaces, logo-mark-white.svg on dark surfaces).
• Use Ocean Blue (#0F4C5F), Emerald Green (#34A56D), and Amber Gold (#F9AF36) as your primary colour references.
• Use the Play typeface for headings and display text to match the brand feel.
• Give the logo adequate space. Do not crowd it with other elements.
• Credit InterlinedList by name when featuring it in reviews, tutorials, or promotional content.

Do not:

• Recolour, distort, rotate, or add effects to the logo.
• Add a wordmark, product name, or tagline to the mark. The brand is the symbol alone.
• Use the logo at sizes smaller than 24 px tall (use the dedicated 16 px / 32 px favicons instead).
• Place the logo on a background that makes it hard to read.
• Imply official endorsement or partnership without written agreement from the InterlinedList team.
• Use InterlinedList's name or logo in a way that could mislead people about the source of your content.
• Combine the logo with other logos without clear visual separation.