Jalsa Salana USA
Brand & Visual Identity Guidelines
Visual identity standards derived from jalsasalana.us, for chapters, auxiliary teams, and partner organizations preparing web pages, flyers, presentations, signage, and digital communications.
01
Purpose of this guide
This document defines the visual identity standards for Jalsa Salana USA, derived from the official website (jalsasalana.us). It's meant to help other teams, chapters, and affiliated organizations maintain a consistent look and feel across all materials — web pages, flyers, presentations, signage, and digital communications.
Consistent use of these colors, typography, and layout patterns helps ensure that anything published under the Jalsa Salana USA name is immediately recognizable and professionally aligned with the primary site.
02
Logo
The primary mark is a circular seal, used in the site header and as the favicon / app icon: a gold ring border with text running along the circumference, a navy blue center field, and a white minaret silhouette with Arabic calligraphy centered inside.
Keep clear space around the seal equal to at least the width of the gold ring.
Usage notes
- Always source the logo file from the official site (jalsasalana.us) or the Jalsa IT Team — do not recreate or redraw it.
- Maintain clear space around the seal equal to at least the width of the gold ring.
- Don't stretch, recolor, or place the seal on busy photographic backgrounds without a solid-color safety plate behind it.
- On dark backgrounds (e.g. the navy/black nav bar) the seal reads clearly as-is — avoid placing it on mid-tone busy imagery instead.
03
Color palette
These are the exact colors extracted from the live site's computed styles. Use the hex values below rather than approximating from a screenshot.
Primary Navy Blue
#295ECF
CTA buttons (Register Now, Subscribe), links
Near-Black
#121111
Nav bar background, footer background
White
#FFFFFF
Hero text, button text, nav text
Body Text Gray
#3B3D42
Paragraph / body copy
Heading Dark
#202020
H2 subheadings, emphasized text
04
Typography
Pairing logic: Kodchasan (rounded geometric display) for high-impact headlines, Nunito (humanist sans) for section headers, and Roboto (neutral workhorse sans) for body copy and UI elements. All three are freely available via Google Fonts.
White on dark backgrounds
#202020
weight 700 for emphasis
Uppercase-style emphasis
05
UI components & layout patterns
5.1 Navigation bar
- Solid near-black background (#121111), sticky on scroll
- White text links; dropdown chevrons for multi-level menu items
- Right-aligned primary CTA button (ghost style — see below)
5.2 Buttons
- Primary, on dark/photo backgrounds: transparent fill, 1px white border, white text, 12px corner radius — a "ghost button."
- Primary, on light backgrounds: solid navy blue (#295ECF) fill, white text, same 12px radius (e.g. newsletter Subscribe button).
5.3 Section rhythm
- Alternating white → light gray → photographic/dark-overlay bands → white
- Card grids for informational content (rounded corners, drop shadow)
- Full-bleed photo bands with dark overlay + centered white heading for calls to action (e.g. newsletter signup)
5.4 Footer
- Full black background
- Four-column info grid: When / Where / Contact / Mobile App
- Darker sub-footer strip with social icons and copyright line, centered
06
Voice & tone
Formal and reverent — this is a faith-based convention, not a commercial event.
Direct, welcoming, and service-oriented language, e.g. "Your Info Hub Awaits," "Find helpful guidance…"
Avoid overly casual or promotional marketing language — favor clarity and hospitality.
07
Guidelines for partner teams
Use the exact hex values above — do not eyeball or approximate colors from screenshots.
Use Kodchasan / Nunito / Roboto (or close Google Fonts equivalents) rather than substituting arbitrary system fonts.
Keep the near-black + navy-blue + white combination as the dominant palette; treat gold as logo-only.
Request the official logo file from the site/brand owner rather than recreating the seal.
When in doubt, match the layout rhythm of jalsasalana.us — alternating light/dark bands, rounded cards, ghost buttons on photos — rather than introducing new UI patterns.