# Getting started

> Adopt the projectious.work identity, tokens, and interface rules without guessing.


The design system is a working contract for projectious.work. It combines the
brand foundations, writing voice, implementation tokens, interface patterns,
accessibility settings, logo rules, and reusable artifacts in one place.

## Start with the non-negotiables

- Write the name as **projectious.work**, always lowercase.
- Join the practices as **Cloud · Agile · Agentic AI**, never with an ampersand.
- Use Plus Jakarta Sans for attention, Source Sans 3 for reading, and IBM Plex
  Mono for code and system output.
- Keep the light application background at `#f8f9fb`; white is a raised
  surface.
- Reserve the orange accent for identity and decisions. It is not body text.
- Use semantic foregrounds on their matching tints and a second channel for
  every status.
- Use no emoji, decorative gradients, rainbow categorisation, or ornamental
  noise on a brand surface.
- Treat code and tokens as MIT-licensed; treat the name and marks as reserved.

## Choose your route

{{< cards >}}
  {{< card title="Write or design" subtitle="Start with identity, voice, colour, typography, logo, and accessibility." link="/docs/" icon="book" >}}
  {{< card title="Build a surface" subtitle="Use the tokens, components, responsive rules, and implementation patterns." link="/docs/developer-guide/" icon="file-code" >}}
  {{< card title="Use an asset" subtitle="Download generated tokens, marks, templates, and machine-readable manifests." link="/downloads/" icon="file" >}}
{{< /cards >}}

## Adopt the system in order

{{< steps >}}
### Read the brand snapshot

Understand the mission, convictions, audience, voice, and the three practice
areas before choosing visual elements.

### Select semantic tokens

Build with roles such as background, surface, foreground, border, status, and
code panel. Raw scale steps exist to implement those roles—not to bypass them.

### Compose a documented pattern

Start from the page shell, marketing surface, agent console, document, slide,
or terminal pattern closest to the job. Change content before inventing chrome.

### Exercise every appearance and setting

Review light, navy dark, and deep dark. Then enable strong focus, link
underlines, 200% text, loose text spacing, reduced motion, reduced transparency,
and high contrast.

### Verify and record provenance

Run the repository checks, inspect the rendered artifact, and record every
third-party asset and licence before publishing.
{{< /steps >}}

{{< callout type="warning" title="The current default focus ring is not conforming" >}}
New surfaces must set `data-focus="strong"`. The faint compatibility default is
approximately 1.2:1 and does not meet WCAG 2.1 SC 1.4.11.
{{< /callout >}}

Continue with the [documentation overview](/docs/) or go directly to the
[developer guide](/docs/developer-guide/).


---
Source: https://projectious-work.github.io/brand/getting-started/index.md