# Brand Kit

## Logo Assets

Official Toros logo assets in black and white variants.

{% hint style="info" %}
White logo variants are designed for dark backgrounds and may not be visible against a white background.
{% endhint %}

### Logo Mark

![Toros Logo Mark - Black](https://158205934-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnyHYiJqFWXxIj7unfEwV%2Fuploads%2Fgit-blob-fdbac04ed93267181bc36a3a5d64cf89708bab77%2FToros_Logo_Mark_black.svg?alt=media)

![Toros Logo Mark - White](https://158205934-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnyHYiJqFWXxIj7unfEwV%2Fuploads%2Fgit-blob-15ea5860114938d17ce06a35ecab03b0903aa46b%2FToros_Logo_Mark_White.svg?alt=media)

### Word Mark

![Toros Word Mark - Black](https://158205934-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnyHYiJqFWXxIj7unfEwV%2Fuploads%2Fgit-blob-087892580a48983fe4e9c4b71b63f2342c45b811%2FToros_Word_Mark_Black.svg?alt=media)

![Toros Word Mark - White](https://158205934-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnyHYiJqFWXxIj7unfEwV%2Fuploads%2Fgit-blob-ce4d6d28788e9ede8d0f959d172bbb287aa04cb9%2FToros_Word_Mark_White.svg?alt=media)

### Extended Word Mark

![Toros Extended Word Mark - Black](https://158205934-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnyHYiJqFWXxIj7unfEwV%2Fuploads%2Fgit-blob-7704c43d7f9f6605554fcb1bb4893b9f3f826a07%2FToros_ExtendedWord_Mark_Black.svg?alt=media)

![Toros Extended Word Mark - White](https://158205934-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnyHYiJqFWXxIj7unfEwV%2Fuploads%2Fgit-blob-b2ff7e97cce6c1a2010c6aa39d75e833aef662ce%2FToros_ExtendedWord_Mark_White.svg?alt=media)

## Typography

* **Inter** — primary UI font for product UI, tables, controls, and body copy
* **Raleway** — secondary display font for headings and branded moments

## Brand Colors

| Token               | Hex Code  | Usage                                                    |
| ------------------- | --------- | -------------------------------------------------------- |
| App Theme Black     | `#000000` | Browser/PWA theme color                                  |
| App Surface         | `#12171F` | Primary app background and dark surfaces                 |
| Primary Text        | `#DEE3ED` | Main text on dark surfaces                               |
| Secondary Text      | `#CCD2DC` | Supporting text and lighter neutral UI text              |
| Divider / Border    | `#657792` | Dividers, separators, muted outlines                     |
| Brand Blue          | `#5790E4` | Primary brand actions and solid buttons                  |
| Brand Blue Hover    | `#70AAEA` | Hover and active brand accent                            |
| Brand Tint          | `#C6DDF7` | Light blue text or outline accents                       |
| Success Green       | `#47A06C` | Success states and positive indicators                   |
| Success Green Hover | `#6CBC87` | Success hover and bright states                          |
| Warning Amber       | `#D7892B` | Warning states and caution highlights                    |
| Danger Red          | `#DF5454` | Errors, destructive actions, and risk states             |
| White               | `#FFFFFF` | High-contrast content and light backgrounds where needed |

## Usage Guidance

* Use the **dark-first** palette for app-related visuals and screenshots.
* Use **blue accents** for primary calls to action and interactive emphasis.
* Keep logos **monochrome** on dark or light backgrounds.
* Reserve success green, warning amber, and danger red for state communication rather than general branding.