Brand Guidelines

Reside Church — Brand Guidelines

"A church to belong in."

Reside Church is a Pentecostal church in Geelong, Victoria, associated with Australian Christian Churches, gathering Sundays at 175 Moolap Station Road, Moolap VIC 3224. Its mission: "We are a Spirit-filled church, devoted to loving God and sharing the Good News of Jesus."

The brand is warm, modern and grounded — not corporate, not flashy, not over-styled. The visual language is built on strong type, deep navy surfaces, and full-bleed photography of the congregation. The wordmark is a lowercase "r." set inside a teardrop / map-pin, a literal sign of Reside: to dwell, to belong in a place.

Contents

  1. Logo
  2. Colour
  3. Typography
  4. Photography
  5. Voice & copy
  6. UI patterns
  7. Motion
  8. Iconography
  9. Asset index

The logomark and full lockup are the most visible expressions of the brand. Treat them as fixed assets: use the supplied files, scale them uniformly, give them room, never modify the design.

Approved variants

File Use
reside-mark-black.png / reside-mark-white.png Logomark only (the pin) — small uses, favicons, avatars
reside-full-black.png / reside-full-white.png Horizontal lockup with wordmark — default
reside-full-black-solid.png / reside-full-white-solid.png Lockup on a solid contrast tile — thumbnails, social tiles
reside-kids.png Approved sub-brand lockup

Safe area

Keep clear space around the logo equal to the height of the "r." pin on all four sides. Nothing enters that zone - text, other logos, image content, page edges, photo subjects, decorative shapes. For the standalone logomark, clear space equals the height of the dot under the r.

Contrast

  • On light surfaces (white, --light, light photos): use the black variant.
  • On dark surfaces (--primary, --secondary, dark photos): use the white variant.
  • On photography: add a navy scrim (30–60% rgba(8,16,31,…)) beneath the logo if the photo is busy or mid-tone.
  • Never sit the logo on --accent (#4F5584) — contrast is too soft. Same for any other mid-tone fill.

Don't

  • Don't stretch, squash, skew or rotate. Always scale uniformly. If it doesn't fit, use the logomark or change the layout.
  • Don't recolour. Only the supplied black and white variants are approved.
  • Don't outline, or add gradients, drop shadows, glows or other effects.
  • Don't swap the wordmark font or re-typeset "reside church".
  • Don't separate the pin from the wordmark to make new arrangements.
  • Don't add anything inside the pin — no swapped letterforms, no icons, no clipped photos.
  • Don't use the squashed lockup at small sizes; use the logomark.

Sub-brands

Ministry sub-brands (currently reside kids) ship as finished lockup artwork, not type-set in code. The kids lockup pairs the lowercase Outfit "reside" wordmark with a hand-lettered ministry name; those letterforms are part of the asset.

  • Use the supplied PNG. Don't recreate the ministry word in CSS or substitute a hand-lettered font.
  • Always lowercase "reside", always paired with the logomark to its left.
  • New sub-brands (youth, worship) must be commissioned as artwork — flag and ask, don't fake it.

2. Colour

Deep navy is the brand neutral and white carries the contrast. The system has no saturated brand accent in its core palette — energy comes from photography, not pigment.

Core

Token Hex Role
--primary #0F172A Deep slate navy — default page surface, dark cards
--secondary #202742 A step up — elevated dark surfaces, footer bands
--accent #4F5584 Muted indigo — strokes, subtle fills, small UI surfaces
--light #F4F7FB Icy off-white — alternate section background
--white #FFFFFF Body text and logos on navy

--primary is nearly black with the faintest blue cast — never pure black, never grey. --accent is never a full-bleed brand colour.

A tonal ramp interpolated from primary → accent, for text hierarchy and hairlines on dark: --navy-950 #08101F, --navy-900 #0F172A, --navy-800 #161E36, --navy-700 #1B2440, --navy-600 #202742, --navy-500 #2A3358, --navy-400 #4F5584, --navy-300 #7E84A8, --navy-200 #B5B9CE, --navy-100 #DEE0EC, --navy-50 #F4F7FB.

Colour Splash palettes

High-saturation pairs for campaign and event surfaces only — series art, posters, Sunday tiles, event heroes. Splash colour never replaces navy as the base brand surface.

Palette Background Foreground
Red #EB4E4F #FFFFFF
Mint #00E5A9 #201E1C
Purple #4500A2 #FF6E6E
Blue / Yellow #304AFB #FED72C

Rules: each palette is one background and one foreground, locked together — never pull a background from one palette and a foreground from another. One palette owns a given piece; use navy, white and the neutral ramp for everything around it.

Surface modes

Three modes do nearly all the work: full-bleed photo with dark overlay, deep-navy section, light off-white section. Maximum of two background colours in any one piece.

3. Typography

Outfit is the only typeface — a modern geometric sans, used across weights 100–900 with 400→800 doing the everyday work. It ships with this system as local @font-face files (variable plus static cuts).

Role Weight Size Tracking / leading
Display XL 800 ExtraBold --fs-display-xl (56 → 104px) −0.02em, line-height ~1.0
Display 800 ExtraBold --fs-display (44 → 72px) −0.02em, line-height ~1.02
H1 700 Bold --fs-h1 (32 → 48px) −0.01em, line-height 1.15
H2 700 Bold --fs-h2 (24 → 36px) −0.01em, line-height 1.15
Body 400 Regular 16–18px line-height 1.4–1.6
Eyebrow 700 Bold 12px 0.08em, uppercase
Buttons 600 Semibold 14–16px sentence case

Headlines are always sentence case. Eyebrows are the only place ALL CAPS is used.

Layout & spacing

  • 4px base spacing scale (--space-1 … --space-32).
  • Generous vertical rhythm: desktop section padding ~80–128px. The page breathes.
  • Container max-width ~1200px, --gutter of clamp(1rem, 4vw, 2rem).
  • Hero sits flush to the top of the viewport; content below has comfortable top padding.

Corners, strokes, shadows

  • --radius-md (12px) is the default for cards, image containers and cornered buttons. --radius-pill (999px) for all CTAs. No sharp corners anywhere.
  • Hairline borders: rgba(255,255,255,0.18) on dark, rgba(15,23,42,0.12) on light. No coloured borders — strokes derive from fg/bg, never a hue.
  • Shadows are navy-tinted rgba(8,16,31,…) and subtle: --shadow-sm resting cards, --shadow-md floating elements, --shadow-lg menus. On dark surfaces, elevation is the 1px inset white --shadow-glow, not a drop shadow.
  • No frosted glass or backdrop blur. Cards are solid.

4. Photography

  • Always full-bleed as a hero. No floating images; photos run edge to edge.
  • Cool, slightly desaturated, warm skin tones preserved. The grade reads cool overall; the people in it stay warm and human.
  • Dark overlay at ~30–55% black over photos carrying type, so white headlines stay readable while the image stays present. Hero gradient: rgba(8,16,31,0.55) → rgba(8,16,31,0.25).
  • Content is people. Worship moments, hands raised, congregation singing, kids, smiling pairs. No empty buildings, no stage-tech showcases, no stock crosses.
  • Production is part of the brand. Screens, mics, guitars and lighting rigs are welcome. Reside is a contemporary-worship church and doesn't hide it.

5. Voice & copy

The voice is warm, plain-spoken, inviting, uplifting and visionary, never preachy, never marketing-slick. Every line reads like a real person inviting another real person into a real room. The energy is joyful, not solemn.

Principles

  • No FOMO, ever. Never "you don't want to miss it", "last chance", or anything that creates pressure or scarcity.
  • Encourage people to be in the room. For baptisms, big Sundays and vision casts: invite, don't warn. "Come be with us", not "don't miss out."
  • Uplifting by default. When something feels stale, the move is more inspiration, not sarcasm, not wit, not winking humour.
  • Joyful, not always serious. Warmth comes through openness and enthusiasm, not jokes.
  • No sarcasm or in-jokes. Even gentle wit reads as a wall to newcomers.

Tone

  • Hospitable and first-person plural. "We" / "us" — the church is a we, and the reader is invited into it.
  • Direct address ("you") is reserved for invitations and instructions — "Plan a Visit", "Find out more", "Get Directions →".
  • Plain English. No jargon, no church-insider shorthand on public surfaces. Theological terms are explained in context.
  • Confident belief, softened by hospitality.
  • No exclamation points in body copy. Energy comes from photography and headline weight.

Casing

  • Sentence case for body copy and most headings — "Who we are".
  • Title case for navigation and CTAs — "About", "Ministries", "Plan a Visit", "Find out more".
  • ALL CAPS only for eyebrow labels — WELCOME TO RESIDE, SUNDAY SERVICE, NEW TO RESIDE, EVERY GENERATION.
  • lowercase in the logo wordmark and ministry sub-brands, which softens the brand.

Vocabulary

Use: church to belong in (the defining tagline), belong / belonging / place to belong, gather, join us, host you, Spirit-filled (sparingly), Plan a visit, What to expect, Sunday service, Ministries.

Avoid: salvation funnel, seeker, crusade, unchurched, believer journey, do life with. None appear in any source material.

Rhythm

Sentences are short — 8–15 words is typical. Commas slow the cadence on welcome copy. Arrows appear as →. No emoji on the public site.

Worked examples

  • Eyebrow → headline: WELCOME TO RESIDE / A Church to Belong in.
  • Section: Who we are — "We are a Church based in Geelong, VIC, associated with Australian Christian Churches. We have been a part of the Geelong community since 1984."
  • Card: NEW TO RESIDE / Plan a Visit / "Parking, arrival, kids check-in and who to look for when you arrive." / Find out more
  • Service: SUNDAY SERVICE / Sunday 10:30am / "Join us each week for worship, scripture, prayer & community."

6. UI patterns

  • Buttons. Filled pill is the primary CTA; outlined pill is the secondary. Filled buttons darken 6–8% on hover and scale to 0.98 on press. Outlined buttons fill with their text colour on hover (white outline → white fill, navy text).
  • Cards. Eyebrow → title → body → CTA, in solid or outlined variants on light and dark. On hover they rise 2px and pick up a slightly stronger shadow.
  • Pill tags. Outlined pills used for in-section navigation; one active state per set.
  • Event cards. A horizontal row: outlined date tile (month / day / weekday), title, one-line description, RSVP pill.
  • Hero. Full-bleed photo, eyebrow, display headline, two CTAs, with a service-time card floating at the bottom-right overlapping the photo edge — a signature pattern.
  • Nav. Sticky top bar: logo left, primary links, "Plan a Visit" filled pill, hamburger on mobile. No fixed footers, floating CTAs or banners.
  • Section rhythm. Photo hero → dark "Who we are" panel → light service info → dark ministries grid → dark footer band.
  • Links drop to 70% opacity on hover and never change hue.

7. Motion

  • Easing: cubic-bezier(0.16, 1, 0.3, 1) — an ease-out-expo feel — for entrances and reveals.
  • Duration: 140ms state changes, 220ms hovers and small transitions, 420ms entrances.
  • Idiom: fades with a slight upward translate of 8–16px.
  • Never: bouncy springs, rotations, parallax. Animation should feel like the room settling, not the room performing.

8. Iconography

Reside uses very few icons, and that restraint is part of the system. The pin/teardrop logomark is the single most-used graphic element.

The live chrome uses only a hamburger for mobile nav, a right-arrow glyph in CTAs (→, U+2192), and chevrons on small inline CTAs.

  • No unicode-as-icon decoration (no ⭐ ✨ ✝).
  • No religious iconography, no crosses, doves or fish. The brand reads as a contemporary community space, not a denominational signal.
  • Emoji are fine in moderation in social captions; default to none on the public site. Never as decoration or hype.

Recommended library: Lucide at stroke width 1.75–2 — it matches Outfit's geometric, slightly rounded character. Reach for arrow-right, arrow-up-right, map-pin (only where geographically meaningful), menu, x, play, calendar, clock, chevron-down, chevron-right, instagram, facebook, youtube, mail. Avoid filled variants, duotone sets and anything illustrative.