Visual Identity

The vibrant nature of our brand truly comes to life in visual execution. Elements in this section have been designed or selected to create a sense of welcome and joy for everyone learning about AOPS. Work closely with these guidelines to help reinforce the inclusive spirit of our schools.

Logo

The AOPS logo was created to embody our schools’ commitment to igniting the academic and spiritual potential in our students. It joins two symbols of the Holy Spirit – the dove and the tongue of flame – into a single, strong icon. Including our full name and tagline, the AOPS logo quickly and powerfully sums up who we are, what we stand for, and what value we can offer to students and their families.

Primary

The primary logo should be used at all times. If not possible, then use the secondary versions of the logo. The secondary dove icon on its own can be used in favicons or social media avatars.


Secondary

Use secondary versions of the logo when the sizing of the primary logo doesn’t allow it to be easily read. The secondary dove icon on its own is only to be used in favicons or social media avatars.


Color Variations and Applications

In monotone printing or in situations where background colors would render a full-colored color illegible, use one of the color variations below.

Black
Primary Logo - Horizontal - Black and White

White

Primary-Logo---Horizontal---White


Logo Usage

Clear Space

The Archdiocese of Philadelphia Schools logo should always be displayed in an uncongested area of any visual composition, allowing ample room for it to breathe and stand prominently on its own. Other visual elements and the document’s edges should all fall outside of these boundaries.

Horizontal

horizontal-clearspace

 

 

 

Vertical

vertical-clearspace

Sizing

The logo should always be clear and legible whether it is in digital or print use. The minimum sizes listed below for print and digital are to be followed to ensure that the logo is easily read, especially the smallest part of the logo – the tagline. If the logo must be smaller than the minimum size listed, then drop the tagline from the logo.

Minimum Size – Digital

minimum-digital

 

 

 

Minimum Size – Print

minimum-print


Improper Logo Usage

DO NOT alter the coloring of the logo

Do not add outlines or change portions of the logo to a different color. Use only the versions provided.

aops_incorrect use_1

DO NOT realign the mark

aops_incorrect use_2

 

 

 

 

DO NOT surround the logo

Do not surround the logo with a holding shape, container, or border.

aops_incorrect use_3

 

DO NOT add effects

aops_incorrect use_4

 

 

 

DO NOT stretch the logo

aops_incorrect use_5

Other Misuses

  • DO NOT separate the components of the dove icon or wordmark
  • DO NOT modify the shape of the logo in any way
  • DO NOT align the dove icon to the bottom of the wordmark in the horizontal version of the logo
  • DO NOT rotate the logo
  • DO NOT crop any part of the logo

Colors

Our colors are a striking way to convey AOPS brand personality. Contemporary and bright, they upend expectations that religious organizations must be stodgy or dark.

Primary

Use examples: headlines, background fills, brand elements

AOPS Blue

RGB

37/183/234

Hex

#25b7ea

CMYK

81/3/5/0

Pantone

306 C

AOPS Red

RGB

236/27/76

Hex

#ec1b4c

CMYK

2/100/62/0

Pantone

1925 C

Secondary

Use examples: accent type, secondary UI elements

AOPS Dark Blue

RGB

13/124/193

Hex

#0d7cc1

CMYK

91/53/0/0

Pantone

285 C

AOPS Dark Red

RGB

205/31/69

Hex

#cd1f45

CMYK

13/100/75/4

Pantone

1935 C

AOPS Black

RGB

59/59/59

Hex

#3b3b3b

CMYK

69/63/62/58

AOPS Gray

RGB

241/241/241

Hex

#f1f0f0

CMYK

4/3/3/0

Typography

Correct application of type is critical to reinforcing our brand by ensuring our messages carry the right tone and feel. Use the guidelines below to promote legibility, impact, and consistency.

 

  • Source Sans Pro
  • Tisa Pro
  • Aleo

 

When using desktop productivity software (Word, PowerPoint, etc.) to create documents that may be distributed to users who do not have access to the AOPS font files, use Arial to ensure visual consistency and maximum compatibility with other users.

View All for Download

Type Properties

PRIMARY HEADLINES ARE SET IN SOURCE SANS PRO BOLD…

Primary headlines are set in all capitals with the specifications listed to the right. Other headlines on the page should use the primary headline typeface and weight while having a smaller type size than the main headline on the page.

Specs:

Letter-Spacing
0.025em
Line-Height
Equal to type size
Adobe CC Tracking
25
Adobe CC Leading
Equal to type size

Secondary headlines are set in Source Sans Pro regular…

Secondary headlines are set in sentence case with the specifications listed to the right.

Specs:

Letter-Spacing
0
Line-Height
1.14x the type size

In the case of secondary headlines

That are paired with sub-headings…

The sub-heading should be smaller and have a heavier weight than the secondary headline.

Body copy is set in Tisa Pro…

Tisa Pro is used as the main body copy in print. It should never be used in all capital letters.

Web Body copy is set in Aleo…

Aleo (use if Typekit is unavailable) used as the main body copy in web. It should never be used in all capital letters.

Specs:

Letter-Space
0em
Line-Height
1.5 the type size
Adobe CC Tracking
0
Adobe CC Leading
1.5x the type size

Call-out copy is set in Tisa Pro Bold…

Call-out copy is used as a descriptor or to give a sentence hierarchy over the body copy.

Specs:

Letter-Spacing
0em
Line-Height
1.33x the type size
Adobe CC Tracking
0em
Adobe CC Leading
1.33 the type size

Example:

typography_heirarchy


Color and Weight

Primary headlines should only use AOPS Blue. However, if there is a secondary headline, it can be displayed using AOPS Red. White headlines should only be used against a colored background.

When providing emphasis in the body copy, use either color or bold weight alone. Never apply multiple emphasis effects at the same time. Reserve colored emphasis for use on Black or White fields.

headline-color

Visual Elements

When employed correctly, these elements can break up text or white space and create visual interest. While the elements themselves are simple, the results they generate are dramatic.

Illustrations

In marketing and digital applications, illustrations are used to help define topics and categories; accompany accent typography like statistical statements; and enhance calls-to-action.

Each illustration should be used as a graphic element that highlights a statement for each page. The illustrations use AOPS Red and AOPS Dark Red or AOPS Blue and AOPS Dark Blue equally to create a flat graphic element that visually represents the statement below it.

icons

View All for Download

Borders

Borders are used to give hierarchy and importance to elements in the AOPS brand.

The border uses only two colors – AOPS Blue or AOPS Red. In print applications, only use the AOPS Blue border. In digital applications, color use depends on the overall balance of the page. If there is more red on the page than blue, use a blue border (and vice versa).

Borders Specs:

border size
6px
print border size
10-25 pt

border-use

Visual Device: Intersection

The intersection of two angular shapes can be used as a visual device to create interest or draw attention. When creating such an intersection, use only straight lines that meet at an angle greater than 90°, but smaller than 180°. Use only AOPS Blue and AOPS Dark Blue for the intersecting shapes — one of each color.

OCE-277d_Pull-up banner_2 1

ignite_eblast

Photography

Photography brings the people and locations that make up our schools to the forefront. The right images humanize our story and demonstrate the open environment in which AOPS learning takes place.

Subject Matter

Photography should be bright, positive, inclusive, relatable, and contemporary in keeping with other brand guidelines.

Whenever possible, include real students, faculty, and locations. Avoid stock photography, especially of individuals.