---
title: "Brand"
description: "Download the Startica logo, S mark and app icon, see the brand and module colors, and how to refer to Startica."
---

## Logo and icon

The logo is free to use when you write about Startica, link to it, or show that something works with it. Please don't change its shape, add effects, or use it as your own product's logo. The source files are in [`packages/brand`](https://github.com/chriscasper/startica/tree/main/packages/brand).

<ul class="not-prose mt-6 grid list-none gap-4 p-0 sm:grid-cols-2">
<li class="border border-line"><div class="flex h-36 items-center justify-center p-6" style="background:#fbf5e9"><img src="/brand/startica-logo.svg" alt="Wordmark, navy" class="max-h-12 w-auto max-w-[80%]"></div><div class="border-t border-line p-4"><p class="font-semibold">Wordmark, navy</p><p class="mt-0.5 text-sm text-muted">For light backgrounds</p><p class="mt-2 text-sm"><a class="link" href="/brand/startica-logo.svg" download>SVG</a> · <a class="link" href="/brand/startica-logo.png" download>PNG</a></p></div></li>
<li class="border border-line"><div class="flex h-36 items-center justify-center p-6" style="background:#01314e"><img src="/brand/startica-logo-light.svg" alt="Wordmark, cream" class="max-h-12 w-auto max-w-[80%]"></div><div class="border-t border-line p-4"><p class="font-semibold">Wordmark, cream</p><p class="mt-0.5 text-sm text-muted">For dark backgrounds</p><p class="mt-2 text-sm"><a class="link" href="/brand/startica-logo-light.svg" download>SVG</a> · <a class="link" href="/brand/startica-logo-light.png" download>PNG</a></p></div></li>
<li class="border border-line"><div class="flex h-36 items-center justify-center p-6" style="background:#01314e"><img src="/brand/startica-mark.svg" alt="S mark" class="max-h-12 w-auto max-w-[80%]"></div><div class="border-t border-line p-4"><p class="font-semibold">S mark</p><p class="mt-0.5 text-sm text-muted">Where the wordmark won't fit</p><p class="mt-2 text-sm"><a class="link" href="/brand/startica-mark.svg" download>SVG</a> · <a class="link" href="/brand/startica-mark.png" download>PNG</a></p></div></li>
<li class="border border-line"><div class="flex h-36 items-center justify-center p-6" style="background:#e9e4da"><img src="/brand/startica-app-icon.svg" alt="App icon" class="max-h-12 w-auto max-w-[80%]"></div><div class="border-t border-line p-4"><p class="font-semibold">App icon</p><p class="mt-0.5 text-sm text-muted">The desktop app's icon</p><p class="mt-2 text-sm"><a class="link" href="/brand/startica-app-icon.svg" download>SVG</a> · <a class="link" href="/brand/startica-app-icon.png" download>PNG</a></p></div></li>
</ul>

Give the logo some room: at least the height of the S on every side. On busy photos, put it on a solid panel.

## Colors

<ul class="not-prose mt-6 grid list-none gap-3 p-0 grid-cols-2 sm:grid-cols-4">
<li class="border border-line"><div class="h-16" style="background:#01314e"></div><div class="p-3"><p class="font-semibold">Ink</p><p class="font-mono text-sm text-muted">#01314e</p><p class="mt-1 text-sm text-muted">Text, the hero plane</p></div></li>
<li class="border border-line"><div class="h-16" style="background:#00517c"></div><div class="p-3"><p class="font-semibold">Ink soft</p><p class="font-mono text-sm text-muted">#00517c</p><p class="mt-1 text-sm text-muted">The hero gradient</p></div></li>
<li class="border border-line"><div class="h-16" style="background:#f15e34"></div><div class="p-3"><p class="font-semibold">Signal</p><p class="font-mono text-sm text-muted">#f15e34</p><p class="mt-1 text-sm text-muted">Buttons, the S mark, highlights</p></div></li>
<li class="border border-line"><div class="h-16" style="background:#f79827"></div><div class="p-3"><p class="font-semibold">Amber</p><p class="font-mono text-sm text-muted">#f79827</p><p class="mt-1 text-sm text-muted">Hover states</p></div></li>
<li class="border border-line"><div class="h-16" style="background:#fab53b"></div><div class="p-3"><p class="font-semibold">Sun</p><p class="font-mono text-sm text-muted">#fab53b</p><p class="mt-1 text-sm text-muted">Accents on dark</p></div></li>
<li class="border border-line"><div class="h-16" style="background:#fbf5e9"></div><div class="p-3"><p class="font-semibold">Cream</p><p class="font-mono text-sm text-muted">#fbf5e9</p><p class="mt-1 text-sm text-muted">Page background</p></div></li>
<li class="border border-line"><div class="h-16" style="background:#0a83b3"></div><div class="p-3"><p class="font-semibold">Sky</p><p class="font-mono text-sm text-muted">#0a83b3</p><p class="mt-1 text-sm text-muted">Accents</p></div></li>
<li class="border border-line"><div class="h-16" style="background:#4d6273"></div><div class="p-3"><p class="font-semibold">Steel</p><p class="font-mono text-sm text-muted">#4d6273</p><p class="mt-1 text-sm text-muted">Muted text</p></div></li>
</ul>

### Module colors

Each module has its own color in the app and on this site. Use them only to tell the modules apart.

<ul class="not-prose mt-6 grid list-none gap-3 p-0 grid-cols-2 sm:grid-cols-4">
<li class="border border-line"><div class="h-16" style="background:#c2441c"></div><div class="p-3"><p class="font-semibold">Marketing</p><p class="font-mono text-sm text-muted">#c2441c</p><p class="mt-1 text-sm text-muted">Dark theme #f47a52</p></div></li>
<li class="border border-line"><div class="h-16" style="background:#0b7a5c"></div><div class="p-3"><p class="font-semibold">SEO & GEO</p><p class="font-mono text-sm text-muted">#0b7a5c</p><p class="mt-1 text-sm text-muted">Dark theme #3ec79c</p></div></li>
<li class="border border-line"><div class="h-16" style="background:#0a6f99"></div><div class="p-3"><p class="font-semibold">Accessibility</p><p class="font-mono text-sm text-muted">#0a6f99</p><p class="mt-1 text-sm text-muted">Dark theme #4fb3e0</p></div></li>
<li class="border border-line"><div class="h-16" style="background:#6b4fd6"></div><div class="p-3"><p class="font-semibold">Security</p><p class="font-mono text-sm text-muted">#6b4fd6</p><p class="mt-1 text-sm text-muted">Dark theme #a996ff</p></div></li>
</ul>

## Type

Headings are set in [Schibsted Grotesk](https://fonts.google.com/specimen/Schibsted+Grotesk) and body text in [Public Sans](https://fonts.google.com/specimen/Public+Sans). Both are free on Google Fonts.

## Writing about Startica

- **Startica**, with a capital S and the rest lowercase. Not "StartIca" or "STARTICA".
- In one line: "Startica is an open-source AI co-founder for everything after you ship."
- The modules are **Marketing**, **SEO & GEO**, **Accessibility** and **Security**.
- Startica is free and open source under the MIT license. It's a desktop app for macOS, Windows and Linux, with no account and no Startica server.
- Please don't say Startica makes a site "compliant", "certified" or "secure". It finds problems with automated checks, and the people who fix them do the rest.

The MIT license covers Startica's code, not its name or logo. If you share a modified version or offer Startica as a service, give it your own name: the [trademark policy](https://github.com/chriscasper/startica/blob/main/TRADEMARKS.md) has the details.

Questions about using the name or logo: [hello@mystartica.com](mailto:hello@mystartica.com).