diff --git a/templates/partials/media_hero.html b/templates/partials/media_hero.html index c5e8bdd..bf11e09 100644 --- a/templates/partials/media_hero.html +++ b/templates/partials/media_hero.html @@ -1,11 +1,11 @@
-

Logo and Brand Assets

-

All the assets and brand resources you need to share OurWorld with the world.

+

Logo and Brand Assets

+

All the assets and brand resources you need to share OurWorld with the world.

-
-

Black Versions (PNG & SVG)

+
+

Black Versions (PNG & SVG)

  • @@ -13,7 +13,7 @@

OW_ICON_BLACK

- + Download Now @@ -22,7 +22,7 @@

OW_LOGO_VERTICAL_BLACK

- + Download Now @@ -31,13 +31,13 @@

OW_LOGO_HORIZONTAL_BLACK

- + Download Now -
+

White Versions (PNG & SVG)

OW_ICON_WHITE

- + Download Now @@ -55,7 +55,7 @@

OW_LOGO_VERTICAL_WHITE

- + Download Now @@ -64,35 +64,211 @@

OW_LOGO_HORIZONTAL_WHITE

- + Download Now -
+

Typography

+ + +
+

Primary Font: Helvetica Download Font

+

The primary font used in OurWorld branding is Helvetica. It is a clean and modern sans-serif typeface used primarily for titles and subtitles that enhances readability and conveys a sense of professionalism.

+
+

This is Helvetica Bold for Titles

+
+
+

This is Helvetica Medium for Subtitles

+
+
+ + +
+

Secondary Font: Cercodemo Download Font

+

The secondary font used in OurWorld branding is Cercodemo. It is a unique and stylish typeface used primarily for body texts and paragraphs that adds a touch of creativity to our designs.

+
+

This is Cercodemo Regular for Body Text

+
+
+

This is Cercodemo Light for Body Text

+
+
+

This is Cercodemo Thin for Caption

+
+
+
+ +
+

Color Palette

+

The OurWorld brand uses a clean, modern color palette that conveys professionalism and innovation.

-

Primary Font: Helvetica Download Font

-

The primary font used in OurWorld branding is Helvetica. It is a clean and modern sans-serif typeface used primarily for titles and subtitles that enhances readability and conveys a sense of professionalism.

-
-

This is Helvetica Bold for Titles

+
+ +
+
+
+

Primary Black

+

HEX: #00000

+

RGB: 17, 24, 39

+

Class: bg-gray-900

+
+
+ +
+
+
+

Primary White

+

HEX: #FFFFFF

+

RGB: 255, 255, 255

+

Class: bg-white

+
+
+ +
+
+
+

Primary Gray

+

HEX: #4B5563

+

RGB: 75, 85, 99

+

Class: text-gray-600

+
+
+ + +
+
+
+

Light Gray

+

HEX: #F3F4F6

+

RGB: 243, 244, 246

+

Class: bg-gray-100

+
+
+ +
+
+
+

Medium Gray

+

HEX: #D1D5DB

+

RGB: 209, 213, 219

+

Class: bg-gray-300

+
+
+ +
+
+
+

Purple

+

HEX: #8B5CF6

+

RGB: 139, 92, 246

+

Class: bg-purple-500

+
+
-
-

This is Helvetica Medium for Subtitles

+ +
+

Brand Guidelines

+

Essential rules to maintain brand consistency across all platforms and materials.

+
+
+ +

Logo Clear Space

+

Always maintain minimum clear space around the logo to ensure visibility and impact. The clear space should be at least equal to the height of the 'O' in the logo.

+ + +

Minimum Size

+

To maintain legibility, do not reproduce the logo smaller than:

+
    +
  • Print: 0.75 inches (19mm) in height
  • +
  • Digital: 30 pixels in height
  • +
+ + +

Logo Usage Guidelines

+
+
+

Do's

+
    +
  • Use approved color variations
  • +
  • Maintain aspect ratio when scaling
  • +
  • Ensure adequate contrast with backgrounds
  • +
  • Use appropriate clear space
  • +
+
+
+

Don'ts

+
    +
  • Don't alter the logo colors
  • +
  • Don't distort or stretch the logo
  • +
  • Don't add effects or shadows
  • +
  • Don't place on busy backgrounds
  • +
+
+
+ + +

File Format Guide

+
+
+

SVG Format

+

Best for:

+
    +
  • Web usage
  • +
  • Responsive design
  • +
  • Large format printing
  • +
  • Digital presentations
  • +
+
+
+

PNG Format

+

Best for:

+
    +
  • Digital applications
  • +
  • Social media
  • +
  • Email signatures
  • +
  • Microsoft Office documents
  • +
+
+
+ + +
+

Writing Guidelines

+
+
    +
  • Always capitalize the 'W' in OurWorld - never write it as 'Ourworld' or 'ourworld'
  • +
+
+
+ + +
+

Brand Voice

+
+
+

Innovative

+

Forward-thinking and solution-oriented

+
+
+

Professional

+

Clear, concise, and authoritative

+
+
+

Approachable

+

Friendly and easy to understand

+
+
+

Authentic

+

Genuine and transparent

+
+
+
+
-
-

Secondary Font: Cercodemo Download Font

-

The secondary font used in OurWorld branding is Cercodemo. It is a unique and stylish typeface used primarily for body texts and paragraphs that adds a touch of creativity to our designs.

-
-

This is Cercodemo Regular for Body Text

-
-
-

This is Cercodemo Light for Body Text

-
-
-

This is Cercodemo Thin for Caption