Brand guidelines

The official reference for using the H.R.A visual identity.

Brand story & meaning

A dove carrying an olive branch

The blue dove with raised wings expresses peace and hope; the green olive branch, humanity and reconciliation; the flowing waves, protection and care; and the red H.R.A seal, law and accountability.

  • Humanity
  • Justice
  • Peace
  • Dignity
  • Law
  • Hope

Core rule

The logo is a fixed master asset. All versions derive from the original artwork without redrawing; never alter its proportions, colours or elements.

Logo variations

Primary logo (vertical)
Primary logo (vertical) — SVG
Horizontal — Arabic UI
Horizontal — Arabic UI — SVG
Horizontal — English UI
Horizontal — English UI — SVG
Arabic logo
Arabic logo — SVG
English logo
English logo — SVG
Emblem
Emblem — SVG
Symbol only
Symbol only — SVG
Monochrome black
Monochrome black — SVG
Monochrome white
Monochrome white — SVG
Favicon
Favicon — SVG
Social avatar
Social avatar — SVG
Watermark
Watermark — SVG

Clear space

Keep clear space around the logo at least equal to the height of the H.R.A seal (≈15% of the circle diameter) on every side.

Minimum size

VersionDigitalPrint
Full vertical120 px30 mm
Horizontal48 px (h)12 mm (h)
Emblem40 px10 mm
Symbol / favicon16 px6 mm

Below these sizes the text is illegible — use the symbol only.

Colour system

Blue is the primary institutional colour, green a humanitarian secondary, and red an accent only — never dominant.

Dove blue — institutional--hra-primary#2B92B1
Buttons & links (AA)--hra-primary-dark#1D7390
Institutional dark--hra-primary-deep#0E3B4A
Light tint--hra-primary-light#E7F3F7
Olive branch — secondary--hra-green#72994E
H.R.A seal — accent only--hra-red#71251C
Section background--hra-bg#F5F8F9
Text--hra-text#16252C
Muted text--hra-muted#5A6B73
Borders--hra-border#DCE5E9
Success--hra-success#2E7A4B
Warning--hra-warning#A15C00
Danger--hra-danger#B3261E

Typography

الكرامة · العدالة · السلام

IBM Plex Sans Arabic — 400 / 500 / 600 / 700

Dignity · Justice · Peace

Inter — variable 400–700

Incorrect usage

Do not stretch or distort
Do not rotate
Do not recolour
Do not place on busy backgrounds
Do not add shadows or effects
Do not crop

The full guide (photography, templates, official documents, email signature) is in docs/brand/HRA-Brand-Guidelines.md.