What this looks like where you are building it.

Specifications

measure

660px maximum for extended reading, roughly 66 characters

breakpoints

600px, 720px, 1080px

socialCard

1200x630 PNG, required on every page

favicon

32px and 16px PNG, plus a 180px apple-touch-icon

Setup

• Link @site/assets/brand.css and @site/assets/fonts/fonts.css. That is the whole setup.
• Copy markup from @site/components rather than rebuilding a component from its description.

Rules

• Three to five priorities on a page. A sixth is a second page.
• Every priority word links somewhere real. No decorative priorities.
• A wide table scrolls inside its own frame. The page body never scrolls sideways.
• The focus ring is never removed.

Specifications

touchTarget

44px minimum on every control, whatever its drawn height

appIcon

1024x1024 source, the glyph on Midnight, no text

splash

Midnight ground, the reversed horizontal lockup, nothing else

states

every control needs default, hover, focus, active, disabled, loading, and empty

Setup

• Install @theword/brand and @theword/ui. Import the stylesheet once at the root.
• Load the three faces with next/font/google, which self-hosts them at build time.
• Keep theming in CSS custom properties, not a JavaScript theme object, so it works unchanged in server components.

Rules

• Error and warning states use the recorded functional colours. Never Flame, never Ember: Ember means the action, and an error is not an action.
• An error names what is wrong and how to fix it. Colour never carries the message alone.
• A dark surface is Midnight, not a darkened Parchment.
• Loading is a wash placeholder, never a spinner over a blank screen.

Specifications

width

600px

logo

PNG at 400px or 800px. Never SVG: most clients strip it.

subjectLine

50 characters or fewer, so it survives a phone

preheader

90 characters or fewer, and never a repeat of the subject

images

PNG only, with alt text that carries the meaning when images are blocked

Setup

• Build from the email-layout and email-button components. Tables and inline styles, not divs and a stylesheet.
• Georgia stands in for the serifs and Arial for DM Sans. The webfont will not load, so the fallback is the design.

Rules

• Every colour is stated explicitly on every cell. A dark-mode client inverts anything left to a default.
• One call to action per email.
• Every email carries a preheader, a line saying why the person is receiving it, and a working unsubscribe.
• The destination URL appears as text in the footer, for clients that strip links.

Specifications

headline

30 characters, 15 per ad group

description

90 characters, 4 per ad group

displayPath

15 characters per path segment, two segments

sitelinkText

25 characters

sitelinkDescription

35 characters per line, two lines

callout

25 characters

Setup

• Assemble every headline and description from the copy bank. Nothing is written at the keyboard in the ad platform.
• A new string joins the bank by passing the audit once, and is then reusable for good.

Rules

• Never a statistic, a claim of outcome, or a number that is not in the official ministry record.
• Never a banned word. The hype list exists because ad copy is where it creeps back in.
• Sentence case. Never all caps, never an exclamation mark.
• The believer and the local church are the hero, not the ministry.

Specifications

landscape

1200x628, ratio 1.91:1

square

1200x1200, ratio 1:1

portrait

960x1200, ratio 4:5

logoSquare

1200x1200, the glyph on Midnight

logoLandscape

1200x300, the horizontal lockup on Midnight

safeArea

keep type and the mark within the centre 80%: the platform crops the edges without asking

Rules

• Documentary photography only. Nothing stock, nothing generated, nothing staged.
• Type over an image sits on the Midnight scrim and is White or Parchment.
• The mark is never smaller than its recorded minimum, whatever the placement.
• Every asset is supplied at every ratio. A missing ratio is filled by the platform, badly.

Specifications

square

1080x1080

portrait

1080x1350

story

1080x1920

storyTitleSafe

keep type out of the top 250px and the bottom 350px: the platform's own chrome sits there

avatar

the glyph, never the wordmark. A wordmark in a circle is unreadable.

cover

1200x630

Rules

• The handle is the name, exactly as recorded in the Brand Guide's channels section.
• A caption carries what happened, then event, place, and date.
• Every initiative post carries the endorsement line.
• Nothing is reposted without consent from the people in it.

Specifications

loop

6 to 15 seconds, muted, looping, with a still poster frame

titleSafe

keep type within the centre 90% for a 16:9 export

lowerThird

sits on the scrim bar, never straight on the footage

subtitles

DM Sans 500 or heavier, on the scrim bar, on every spoken word

export

H.264 MP4, 1080p at minimum, plus a poster JPG at the same frame

Rules

• Every loop ships with the still that stands in for it under a reduced-motion preference.
• Nothing animated bounces or springs.
• Every subject is a co-labourer in the gospel, never an object of pity.
• Consent is obtained before capture, not asked for afterwards.

Specifications

colourSpace

CMYK. The recorded values are an unprofiled starting point and are confirmed on a proof.

bleed

3mm on every trimmed edge

safeMargin

5mm inside the trim, and never less than the mark's own clear space

resolution

300dpi for any raster placed in a print document

minimumMarkWidth

40mm for the horizontal lockup, 25mm for the stacked

Setup

• Send the vector and the recorded colour values. Never send a PNG to a printer.
• Import the palette from the Adobe swatch file rather than typing hex values into a document.

Rules

• A vendor never samples a colour off a screenshot.
• Embroidery and engraving take the one-colour black file, which has no anti-aliasing to misread.
• A corrected colour from a proof comes back into the guide through a changelog entry, never as a note in someone's inbox.

Specifications

size

16:9, 1920x1080

titleSlide

Midnight ground, reversed lockup, serif headline

bodySlide

Parchment ground, one idea per slide

figures

the official-record figure component, with its source line

Rules

• One idea per slide. A slide with two ideas is two slides.
• The serif carries headlines only. Bullets are DM Sans.
• A figure on a slide still names the record it came from.