---
name: Dominicana Tech Week
version: alpha
website: https://dominicanatechweek.do/
colors:
  # Navy and pink are CO-PRIMARIES — neither is an accent. primary is the
  # dominant navy field, primary-pink is the energy and the icon's color.
  # TODO: confirm exact navy/cream/secondary hexes against the brand source
  # file — primary-pink (#ff2587) and ink (#000000) are sampled from the logo
  # exports; the rest are sampled by eye from the brand boards.
  primary: "#15375f"
  primary-pink: "#ff2587"
  ink: "#000000"
  background: "#f0ebe0"
  surface: "#ffffff"
  text: "#000000"
  text-muted: "#555555"
  on-primary: "#ffffff"
  border: "#ddd5c6"
  sky: "#29b5f2"
  sky-support: "#5380d6"
  green: "#1ec760"
  green-support: "#a8e92f"
  sponsor: "#fdc845"
  sponsor-support: "#f8862e"
  violet: "#5d4fa6"
  violet-support: "#a487ea"
  teal: "#207f8e"
logo:
  color:
    src: assets/logo-color.png
    background: "{colors.background}"
    usage: Primary lockup — cream and light surfaces
  negative:
    src: assets/logo-negative.png
    background: "{colors.primary}"
    usage: Pink icon + white wordmark — navy and black surfaces
  black:
    src: assets/logo-black.png
    background: "{colors.background}"
    usage: Mono ink lockup — single-color print and stamps
  white:
    src: assets/logo-white.png
    background: "{colors.ink}"
    usage: Mono reversed — black surfaces and photography
typography:
  h1:
    fontFamily: Outfit
    fontSize: "72px"
    fontWeight: "800"
    textTransform: uppercase
    letterSpacing: "0.01em"
  h2:
    fontFamily: Outfit
    fontSize: "48px"
    fontWeight: "800"
    textTransform: uppercase
    letterSpacing: "0.01em"
  h3:
    fontFamily: Outfit
    fontSize: "30px"
    fontWeight: "700"
    textTransform: uppercase
  h4:
    fontFamily: Outfit
    fontSize: "20px"
    fontWeight: "700"
    textTransform: uppercase
  body-md:
    fontFamily: Outfit
    fontSize: "16px"
    fontWeight: "400"
  body-sm:
    fontFamily: Outfit
    fontSize: "14px"
    fontWeight: "400"
  label:
    fontFamily: Outfit
    fontSize: "12px"
    fontWeight: "700"
    textTransform: uppercase
    letterSpacing: "0.08em"
  code:
    fontFamily: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace
    fontSize: "14px"
    fontWeight: "400"
rounded:
  sm: "4px"
  md: "8px"
  lg: "16px"
  full: "9999px"
spacing:
  xs: "4px"
  sm: "8px"
  md: "16px"
  lg: "24px"
  xl: "48px"
components:
  button-primary:
    backgroundColor: "{colors.primary-pink}"
    textColor: "{colors.on-primary}"
    typography: "{typography.label}"
    rounded: "{rounded.md}"
    padding: "12px 32px"
  button-secondary:
    backgroundColor: "transparent"
    textColor: "{colors.ink}"
    typography: "{typography.label}"
    rounded: "{rounded.md}"
    padding: "12px 32px"
  card:
    backgroundColor: "{colors.surface}"
    textColor: "{colors.ink}"
    rounded: "{rounded.md}"
    padding: "{spacing.lg}"
  nav:
    backgroundColor: "{colors.primary}"
    textColor: "{colors.on-primary}"
    typography: "{typography.label}"
  sponsor-tag:
    backgroundColor: "{colors.sponsor}"
    textColor: "{colors.ink}"
    typography: "{typography.label}"
    rounded: "{rounded.sm}"
    padding: "6px 12px"
---

## Overview

Dominicana Tech Week ([dominicanatechweek.do](https://dominicanatechweek.do/)) is a loud, festival-energy event brand that is *deliberately* all over the place: one geometric "A" mark, one typeface, and a wide set of sanctioned color modes that let every piece of collateral look different while staying unmistakably DTW. The two true primaries are deep navy (#15375f) and hot pink (#ff2587) — used together, including blue/pink compositions where pink type and marks sit on the navy field. Black is the text color and the second background, cream is the default ground. Everything is set in Outfit — heavy, uppercase, geometric — matching the logo's constructed letterforms.

## Preview

> These three SVGs in `generated/` are auto-built from this file's
> frontmatter by `npm run build`. Don't hand-edit them; edit the tokens above.

### Colors
![Color palette](generated/preview-colors.svg)

### Typography
![Typography scale](generated/preview-typography.svg)

### Components
![Components](generated/preview-components.svg)

## Logo

Assets stored in `assets/`:

| File | Description | Usage |
|------|-------------|-------|
| `assets/logo-color.png` | Pink icon + black wordmark (horizontal) | Primary — cream/light surfaces |
| `assets/logo-negative.png` | Pink icon + white wordmark | Navy and black surfaces |
| `assets/logo-black.png` | All-ink mono lockup | Single-color print, stamps |
| `assets/logo-white.png` | All-white mono lockup | Black surfaces, photography |

**Usage rules:**

- The two **main lockups** are the ones carrying the full "Dominicana Techweek" name (boards 18 and 20): pink icon + black wordmark on cream, and pink icon + white wordmark on navy. Use them for all official, first-touch, and partner-facing material.
- The icon-only "A" mark is for secondary applications — avatars, favicons, patterns, and the color-mode tiles described below. Never icon-only on official comms.
- Minimum display width: 140px for the full lockup.
- Always maintain the original aspect ratio; never recolor outside the sanctioned modes; no effects.
- Clear space: at least the height of the "A" icon's inner notch on all four sides.
- # TODO: export the icon-only mark and the stacked lockups (boards 18/20) from Jaime's source file and add them to `assets/`.

## Colors

Two **co-primary** colors lead every layout — pink is not an accent, it carries equal weight:

- **primary (#15375f)** — deep navy. Dominant field for hero surfaces, save-the-dates, and the navy main lockup.
- **primary-pink (#ff2587)** — hot pink. The icon's color and the loudest signal in the system; CTAs, headline highlights, and full pink fields. Navy + pink together (pink type/marks on the navy field) is a signature composition.

Supporting neutrals:

- **ink (#000000)** — black. Technically the text color, but also a relevant brand color in its own right: it is the **second background** (after cream) and the mono lockup color.
- **background (#f0ebe0)** — warm cream. Default page/poster ground.
- **surface (#ffffff)** — white. Cards and panels on cream.
- **text / text-muted / border** — ink for copy, mid-grey for secondary copy, warm grey for hairlines.

Secondary palette — five pairs, each a main color with its **support color** for icon/accent work within the same tile:

| Pair | Main | Support |
|------|------|---------|
| Sky | `sky #29b5f2` | `sky-support #5380d6` |
| Green | `green #1ec760` | `green-support #a8e92f` |
| **Sponsor (Patrocinios)** | `sponsor #fdc845` | `sponsor-support #f8862e` |
| Violet | `violet #5d4fa6` | `violet-support #a487ea` |
| Teal | `teal #207f8e` | (pairs with navy icon) |

**The yellow pair is reserved**: `sponsor` + `sponsor-support` are used for **all sponsor/patrocinios items** and nothing else. The sky, green, and violet pairs (plus teal) are free for all other applications — sessions, tracks, social, merch.

## Typography

Everything is **[Outfit](https://fonts.google.com/specimen/Outfit)** — a geometric sans that matches the logo's constructed letterforms. Headlines are ExtraBold (800) uppercase, echoing the "SAVE THE DATE" poster treatment; UI labels are Bold (700) uppercase with wide tracking; body copy is Regular (400) sentence case. The wordmark itself is custom lettering — never typeset "Dominicana Techweek" in Outfit as a logo substitute.

## Layout

4-based spacing scale. Posters and social lead with oversized type filling the frame edge-to-edge; digital surfaces use conventional container gutters (20–24px). Generous negative space around the logo, dense type stacks elsewhere — the contrast is the look.

## Shapes

Base radius 8px for UI (buttons, cards). The brand's print/social language is sharp and geometric — radius is a screen affordance, not a brand trait. Pill (`full`) only for tags/chips.

## Components

- **button-primary** — pink on white text, Outfit label uppercase. The single CTA style.
- **button-secondary** — transparent with ink text (use on-primary white text on navy/ink fields).
- **card** — white surface on the cream ground, ink text.
- **nav** — navy bar, white Outfit uppercase labels.
- **sponsor-tag** — the yellow chip. Sponsor/patrocinios items only.

## Color Modes

The boards define sanctioned **icon color modes** (tiles 11–20) — combinations of the "A" mark and a background. This is how the brand stays "all over the place" without breaking:

- **Primary modes**: pink icon on navy; white icon on pink; pink icon on cream (the main lockups' modes).
- **Secondary modes**: each secondary pair renders the icon in its support color on the main color (e.g. lime icon on green, lavender icon on violet, orange icon on yellow) — or tone-on-tone within the pair.
- **Sponsor mode**: orange icon on yellow — sponsor materials only.
- Black/white mono modes follow the mono lockups.

Pick any sanctioned mode per piece; vary them aggressively across a campaign.

## Do's and Don'ts

- **Do** use the full-name lockups (color on cream, negative on navy) for all official and first-touch material — the icon alone is for secondary applications.
- **Do** vary the sanctioned color modes aggressively across a campaign; sameness is off-brand, the system is designed to be remixed.
- **Do** keep yellow (+ orange support) exclusively for sponsor/patrocinios items — it's the one mode with a fixed meaning.
- **Do** set all display type in Outfit 800 uppercase; the heavy geometric voice is the brand's typographic signature.
- **Don't** invent icon/background color combinations outside the sanctioned modes — secondary pairs stay paired with their own support color.
- **Don't** recreate the wordmark by typesetting it in Outfit — the lockup is custom lettering and ships only as an asset.
- **Don't** use pink and navy at less than full saturation, as tints, or with transparency — colors are flat and full-strength everywhere.
- **Don't** put the color lockup on navy, black, or photography — use the negative or white versions there.

## Roadmap

Captured from Jaime's brand boards. Outstanding work:

- Export the icon-only mark and the stacked lockups (boards 18/20) from Jaime's source file.
- Confirm the navy / cream / secondary hexes against the source file (pink and black are exact).
- Add and confirm a brand tagline.