# AppDeen AI brand rules

Version 1.2 · October 2026 · https://brand.appdeen.ai
Follow every rule in this file exactly when you produce anything branded AppDeen AI: pages, apps, documents, slides, social posts, images and copy. When a rule and a request conflict, follow the rule and say so.

## 1. Identity

- Name: **AppDeen AI**. Second mention: **AppDeen**. Never "Appdeen", "App Deen", "APPDEEN" in sentences, or "AppDeen.ai" in sentences.
- What AppDeen AI does: rents senior, pre-trained AI employees and makes companies AI-ready. Based in Amman, Jordan. Contact: hello@appdeen.ai. Website: appdeen.ai.
- Tagline, exactly: **We don’t rent agents. We rent experience.**
- Call the product **AI employees**. Not bots, assistants or tools. Use "agents" only in the tagline and technical documents.
- Employees have a first name and a role: "Salma, Executive Assistant". In credits: "Salma AppDeen". Current roster: Mr. AppDeen (Orchestrator), Salma (Executive Assistant, live), Max (Head of Marketing, in training), Steve (Genius Artificer, in training).
- Never name a client, client project, partner or AI model provider in public work without written approval from AppDeen AI.

## 2. Colour

**One blue only: AppDeen Blue #2254F2, the blue in the logo, on light and on dark.** Never a lighter or darker version of it, never light blue, pastel blue, cyan or any other blue. Never gradient text. The dark neutrals (Void, Navy, Panel) are near-black with no blue in them, so the logo blue stands out against them.

| Name | Value | CSS token | Use |
|---|---|---|---|
| blue | `#2254F2` | `--ad-blue` | AppDeen Blue, the blue in the logo and the only blue, on light and on dark. Logo, buttons, links, chevrons, numerals, glows. |
| void | `#0B0D13` | `--ad-void` | Void. Page background. |
| navy | `#12151D` | `--ad-navy` | Navy. Sections on dark, text on light. |
| panel | `#181C26` | `--ad-panel` | Panel. Cards and raised surfaces on dark. |
| line | `#212939` | `--ad-line` | Line. Borders and dividers on dark. |
| white | `#FFFFFF` | `--ad-white` | White. All text on dark. |
| paper | `#F3F5F9` | `--ad-paper` | Paper. Light sections and documents. |
| graphite | `#181919` | `--ad-graphite` | Graphite. Wordmark in Full colour and Mono black logos. |
| line-light | `#D8DEEA` | `--ad-line-light` | Borders and table rules on light. Never text. |
| success | `#22C08A` | `--ad-success` | Status: success. |
| warning | `#F5A524` | `--ad-warning` | Status: warning. |
| danger | `#F04D63` | `--ad-danger` | Status: danger. |
| blue-40 | `rgba(34, 84, 242, .40)` | `--ad-blue-40` | Tint of AppDeen Blue. Dark backgrounds only. |
| blue-24 | `rgba(34, 84, 242, .24)` | `--ad-blue-24` | Tint of AppDeen Blue. Dark backgrounds only. |
| blue-12 | `rgba(34, 84, 242, .12)` | `--ad-blue-12` | Tint of AppDeen Blue. Dark backgrounds only. |

Text rules:
1. On Void, Navy and Panel: text is #FFFFFF. Never grey. Make hierarchy with size and weight.
2. Blue text on dark: only at 24px and larger (headlines, numerals). Smaller text stays white.
3. On Paper and white: text is Navy #12151D. Links and accents in AppDeen Blue #2254F2.
4. On AppDeen Blue: text is white only.
5. Highlight the last phrase of a display headline in AppDeen Blue, like the "AI" in the logo.
6. Status colours (success, warning, danger) are for product states only, never decoration.
7. A typical screen is about 70% Void and Navy, 22% white and 8% AppDeen Blue.

## 3. Typography

- Load: `<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@125,600..900&family=DM+Sans:opsz,wght@9..40,400..700&family=Space+Mono:wght@400;700&display=swap">`
- **Archivo Expanded** (Archivo, `font-stretch:125%`), weight 700–800, tight tracking (−0.02em to −0.04em): headlines, numbers, names.
- **DM Sans** 400–700: anything read as a sentence, UI and buttons.
- **Space Mono** 700, uppercase, letter-spacing 0.14em: labels, eyebrows, tags, status, data.
- **Readex Pro** 400–700: all Arabic text. Set `dir="rtl"`, mirror layouts and arrows, keep the logo as it is.
- Eyebrows start with `>>>` in AppDeen Blue, then the label in white (on dark) or Navy (on light).
- One display-size headline per screen. Sentence case. Body lines under 65 characters. No italics. Never letter-space a sentence.
- Scale (CSS tokens): display `clamp(2.5rem, 1rem + 7.4vw, 7.5rem)`, h1 `clamp(2.25rem, 1.4rem + 3.6vw, 4.5rem)`, h2 `clamp(1.75rem, 1.3rem + 1.9vw, 3rem)`, h3 24px, h4 19px, body 16px, small 14px, label 12px.

## 4. Logo

Files are drawn, never typed. Use them unedited. Lockups: `stacked` (primary), `horizontal`, `mark`, `wordmark`.
- Full colour: `https://brand.appdeen.ai/assets/logo/svg/appdeen-ai-<lockup>-full-colour.svg` (PNG in `/assets/logo/png/`). Use on white or Paper.
- Full colour · dark: `https://brand.appdeen.ai/assets/logo/svg/appdeen-ai-<lockup>-full-colour-dark.svg` (PNG in `/assets/logo/png/`). Use on Void, Navy or dark photos.
- Mono white: `https://brand.appdeen.ai/assets/logo/svg/appdeen-ai-<lockup>-white.svg` (PNG in `/assets/logo/png/`). Use on AppDeen Blue or photos with a 40% Void scrim.
- Mono black: `https://brand.appdeen.ai/assets/logo/svg/appdeen-ai-<lockup>-black.svg` (PNG in `/assets/logo/png/`). Use on white or Paper.
- Brand blue: `https://brand.appdeen.ai/assets/logo/svg/appdeen-ai-<lockup>-blue.svg` (PNG in `/assets/logo/png/`). Use on white or Paper.
- Glow mark (hero sections on Void only): `https://brand.appdeen.ai/assets/logo/svg/appdeen-ai-mark-glow.svg`
- Favicon and app icons: `https://brand.appdeen.ai/assets/icons/`
- Clear space on every side = the diameter of the hole in the mark. Minimum widths: stacked 72px, horizontal 120px, mark 16px, wordmark 96px.
- Header logo: horizontal, Full colour · dark, 24px tall (20px on mobile).
- Never recolour, use light blue, stretch, rotate, add outlines or shadows, rearrange, or put the light-background version on dark.

## 5. Characters

Visor states (UI and video): `https://brand.appdeen.ai/assets/characters/visor/<state>.svg` for idle, listening, thinking, working, needs-approval, done, offline (PNG stills in `/png/`). Show only the state the product is in. Amber = needs approval, green = done, otherwise the mark stays AppDeen Blue.

Every AI employee is a matte black humanoid robot with a rounded glossy helmet, visor and over-ear headphones, no face. The visor shows the AppDeen mark glowing in AppDeen Blue. A glowing mark patch sits on the character's left shoulder. Wardrobe names the role and is all black. Blue appears only as light, plus at most one accent piece. Pure black background, blue rim light, 2:3 portrait, waist up, head in the top third, professional proportions. Masters: 1024×1536 PNG. Web: 768×1152 WebP. Images: `https://brand.appdeen.ai/assets/characters/<name>.webp` for mr-appdeen, salma, max and steve; PNG masters in `/assets/characters/source/`.

## 6. Components

Use `https://brand.appdeen.ai/assets/brand/tokens.css` and `https://brand.appdeen.ai/assets/brand/components.css`. Body gets `class="ad-root"`; light sections get `class="ad-light"`. Components: `.ad-btn--primary` (AppDeen Blue, pill, 48px), `.ad-btn--secondary`, `.ad-link` with an arrow, `.ad-eyebrow`, `.ad-nav` (glass pill), `.ad-status--live|--training|--concept`, `.ad-card`, `.ad-field`/`.ad-input`, `.ad-powered` (required "Powered by AppDeen AI" footer badge on client platforms, linked to https://appdeen.ai), `.ad-emp` (employee card). One primary button per view.

## 7. Motion

Ease out `cubic-bezier(.2,.7,.2,1)` for entrances (600ms) and hovers (160ms); ease in-out `cubic-bezier(.65,0,.35,1)` for large moves (900ms). One cinematic moment per page, the hero. Respect `prefers-reduced-motion`. No bounce, spin or parallax on text.

Hero (copy appdeen.ai): a fixed full-screen canvas running `https://brand.appdeen.ai/assets/brand/living-mark.js` with the mark centred (`LivingMark.mount(canvas)`, centre 0.5/0.5, zoom 2.3); the headline bottom-left at 7vh/7vw padding, Archivo Expanded 800, `clamp(34px, 8.5vw, 84px)`, the last phrase in AppDeen Blue; a `>>>` eyebrow above it; a bouncing chevron at the bottom centre. On scroll the canvas scales up to 7× into the hole of the mark and fades while the hero fades: the dive-through. Use the shader unchanged; its highlights are light, never colours to pick for UI.

Videos: open or close with the logo sting `https://brand.appdeen.ai/assets/motion/appdeen-sting-16x9.mp4` (or `-9x16.mp4`), unedited, with its sonic logo `https://brand.appdeen.ai/assets/sound/appdeen-sonic-logo.mp3` or silence. Never under speech. Product notifications may use `https://brand.appdeen.ai/assets/sound/appdeen-chime.mp3`.

## 8. Documents and templates

Never design a document from scratch. Use these templates:

| Template | Format | Renderer | Data shape | What it is |
|---|---|---|---|---|
| Invoice | A4 · PDF | https://brand.appdeen.ai/templates/invoice.html | https://brand.appdeen.ai/templates/invoice.json | Tax invoice with 16% sales tax, totals in words, bank and CliQ details, and a JoFotara QR slot. |
| Invoice · English and Arabic | A4 · PDF | https://brand.appdeen.ai/templates/invoice-bilingual.html | https://brand.appdeen.ai/templates/invoice-bilingual.json | Bilingual tax invoice with 16% sales tax, totals in English and Arabic words, bank details and a JoFotara QR slot. |
| Credit note | A4 · PDF | https://brand.appdeen.ai/templates/credit-note.html | https://brand.appdeen.ai/templates/credit-note.json | Credit against an original invoice with 16% sales tax reversed, the total in words, settlement and a JoFotara QR slot. |
| Receipt | A5 · PDF | https://brand.appdeen.ai/templates/receipt.html | https://brand.appdeen.ai/templates/receipt.json | Payment receipt with the amount in figures and words. |
| Quotation | A4 · PDF | https://brand.appdeen.ai/templates/quotation.html | https://brand.appdeen.ai/templates/quotation.json | Price quote that splits one-time and monthly fees, with terms and client acceptance. |
| Purchase order | A4 · PDF | https://brand.appdeen.ai/templates/purchase-order.html | https://brand.appdeen.ai/templates/purchase-order.json | Order to a supplier with delivery details, 16% sales tax, terms and an authorised signature. |
| Service agreement | A4 · multi-page PDF | https://brand.appdeen.ai/templates/agreement.html | https://brand.appdeen.ai/templates/agreement.json | Contract for renting AI employees: 12 clauses, fee schedule and signatures. |
| Service agreement · English and Arabic | A4 · multi-page PDF | https://brand.appdeen.ai/templates/contract-bilingual.html | https://brand.appdeen.ai/templates/contract-bilingual.json | The AI employee service agreement in English and Arabic side by side, clause by clause, with fee schedule and bilingual signatures. |
| Mutual NDA | A4 · multi-page PDF | https://brand.appdeen.ai/templates/nda.html | https://brand.appdeen.ai/templates/nda.json | Two-way confidentiality agreement for discovery calls and pilots. |
| Project timeline | A4 landscape · PDF | https://brand.appdeen.ai/templates/timeline.html | https://brand.appdeen.ai/templates/timeline.json | Week-by-week plan with owners, milestones and a today marker, drawn to scale. |
| Monthly report | A4 · PDF | https://brand.appdeen.ai/templates/report.html | https://brand.appdeen.ai/templates/report.json | Client performance report: KPIs with change, a 6-month chart, done, next, risks and decisions. |
| Client onboarding pack | A4 · multi-page PDF | https://brand.appdeen.ai/templates/onboarding.html | https://brand.appdeen.ai/templates/onboarding.json | Pack for a new client: their AI employees and people, the access checklist, the first 30 days, how we work and sign-off. |
| Meeting notes | A4 · PDF | https://brand.appdeen.ai/templates/minutes.html | https://brand.appdeen.ai/templates/minutes.json | Agenda, decisions and action items with owners and due dates. |
| Letterhead | A4 · PDF | https://brand.appdeen.ai/templates/letter.html | https://brand.appdeen.ai/templates/letter.json | Formal letter on AppDeen AI letterhead. |
| Offer letter | A4 · multi-page PDF | https://brand.appdeen.ai/templates/offer-letter.html | https://brand.appdeen.ai/templates/offer-letter.json | Employment offer with role, salary in JOD, benefits, leave, probation, Social Security and a signed acceptance. |
| Payslip | A4 · PDF | https://brand.appdeen.ai/templates/payslip.html | https://brand.appdeen.ai/templates/payslip.json | Confidential monthly payslip: earnings, deductions, Social Security shares, net pay in words and employer contributions. |
| Business cards | 85 × 55 mm · PDF | https://brand.appdeen.ai/templates/cards.html | https://brand.appdeen.ai/templates/cards.json | Front and back, one back per person. Send the PDF to the printer as is. |
| Email signature | HTML · Gmail, Outlook | https://brand.appdeen.ai/templates/signature.html | https://brand.appdeen.ai/templates/signature.json | Table-based signature that survives Gmail, Outlook and Apple Mail. |
| Certificate | A4 landscape · PDF | https://brand.appdeen.ai/templates/certificate.html | https://brand.appdeen.ai/templates/certificate.json | Certificate of completion for AI courses, schools and corporate training. |
| Social posts | 1080 · 1080×1920 · 1584×396 | https://brand.appdeen.ai/templates/social.html | https://brand.appdeen.ai/templates/social.json | Instagram post, story and LinkedIn banner at platform sizes. |
| Presentation | 16:9 · PDF | https://brand.appdeen.ai/templates/deck.html | https://brand.appdeen.ai/templates/deck.json | Six slide layouts: cover, section, three points, big number, quote and close. |
| Signage | Banner · A2 · door · A4 | https://brand.appdeen.ai/templates/signage.html | https://brand.appdeen.ai/templates/signage.json | Roll-up banner, A2 poster, meeting-room door signs and a bilingual wayfinding sign, each at its real print size. |
| Merchandise | Tee · stickers · badge · tote · mug | https://brand.appdeen.ai/templates/merch.html | https://brand.appdeen.ai/templates/merch.json | Print-ready artwork for T-shirt front and back, a die-cut sticker sheet, staff ID badges, a tote bag and a mug wrap. |

How to fill one:
1. Fetch the template's `.json`. Keep every key and the structure.
2. Fill every value from the task. Money in JOD with 3 decimals unless told otherwise. Jordan's general sales tax is 16%.
3. Open `<template>.html?data=<base64url of the JSON>` in a browser. base64url = base64 of the UTF-8 JSON with `+`→`-`, `/`→`_`, no `=` padding.
4. Print to PDF (Chrome: `--headless --print-to-pdf`). Name the file `AppDeen-AI_<Type>_<Number>_<Client>.pdf`.
5. Jordan invoices and credit notes are cleared in JoFotara, which issues the QR code. Put its image URL in `jofotara.qr_image`.
6. Arabic or bilingual documents: use `invoice-bilingual` and `contract-bilingual`. Arabic is set in Readex Pro, right to left, with Western digits.
7. Print margins: None for one-page documents, Default for documents that run over pages (page numbers print in the margins).

Numbering: INV-YYYY-NNNN (English and bilingual invoices share it), CRN-YYYY-NNNN, RCT-YYYY-NNNN, QUO-YYYY-NNNN, PO-YYYY-NNNN, AGR-YYYY-NNNN (English and bilingual), NDA-YYYY-NNNN, PLN-YYYY-NNNN, RPT-YYYY-MM, ONB-YYYY-NNNN, MTG-YYYY-NNNN, LTR-YYYY-NNNN, OFR-YYYY-NNNN, PAY-YYYY-MM-<employee id>, CERT-YYYY-NNNNN. Never reuse a number.

## 9. Voice

Plain, confident, specific. Short sentences. Numbers over adjectives. Active voice. Honest about what is live, in training or coming soon. Human voice (DM Sans) for sentences; machine voice (Space Mono caps) for labels and data. Primary call to action: "Talk to us".

## 10. Ship checklist

- Only AppDeen Blue #2254F2. No lighter blue, no cyan, no gradient text.
- Text on dark is #FFFFFF.
- Logo files unedited; right colourway for the background; clear space and minimum sizes kept.
- Archivo Expanded headlines, DM Sans sentences, Space Mono labels.
- One primary button per view. Body contrast at least 4.5:1.
- Motion respects reduced motion.
- "Powered by AppDeen AI" badge on client platforms.
- No client, partner or model names without approval.
