Shield and logo

The Penn Medicine shield and Penn Medicine logo represent our institutional identity. These guidelines are intended for digital environments only including websites, mobile apps, digital signage, and other on-screen applications. Adapted from the full Penn Medicine Brand Standards, this reference ensures correct and accessible use within digital products.

Visual identity overview
Shield and logo
Color standards
Photography
Typeface and text styles

Standard scope

This standard applies to:

  • pennmedicine.org
  • All Penn Medicine websites
  • Penn Medicine mobile applications
  • All Penn Medicine digital products

Overview

The Penn Medicine shield and logo are used on websites and mobile applications to:

  • Capture attention: A clear and consistent visual identity builds brand recognition and raises awareness of our health system, clinical research, hospitals, clinical specialties, and member partners.
  • Increase trust: Represents the essence and principles of Penn Medicine.
  • Differentiate: Communicates direct association with the brand.

Use cases

The following table provides guidance on use of the Penn Medicine shield and logo. Examples are included following the table.

Penn Medicine logo type
When to use
Two-color logo
The two-color logo is the preferred color version and should be used wherever possible.
Simplified shield logo
Use the simplified shield when the Penn Shield becomes too small to reproduce clearly and the fine details (dolphin and open volumes) are no longer distinguishable.
•  Recommended for sizes under 60 pixels high
•  Minimum size for simplified shield: 30 pixels high

Two-color logo

Simplified shield logo

Behavior

Interactive

  • When used in the masthead, the logo is clickable and always return the user to the home page.


Guidelines

Color

The Penn Medicine Blue and Penn Medicine Red colors are a strong representative of our brand, and it is important to ensure these colors are reproduced consistently and accurately.

Always ensure there is sufficient contrast between the logo artwork and background. On dark backgrounds, you must use the reversed-out version of the Penn Medicine shield and wordmark.

Use these RGB color values to ensure you have the accurate colors:

Penn Medicine Blue
R: 001
G: 031
B: 091
#011F5B
Penn Medicine Red
R: 153
G: 000
B: 000
#990000

Minimum clear space

One way to ensure the strong visual presence of our logo is to maintain a minimum clear space surrounding it. Elements such as nearby copy, photography, or illustrations must not enter the clear space borders around the logo. Follow the formula in this example to ensure you have the required minimum of clear space. Providing more space than this required is encouraged.

The minimum dimensions of the clear space surrounding our logo is based on the x-height of the logotype. Use this formula to calculate clear space for all versions and sizes of our logo. This is the minimum required—more space is better for visibility and impact.

External use

The Penn Medicine logo should not be used on 3rd party websites without the express agreement of the Penn Medicine legal team, brand team, and data team. The increased scrutiny of the regulatory environment, coupled with the legal implications and liability for non-compliance, means that Penn Medicine must adopt a more cautious approach to the management of websites affiliated with and bearing the Penn Medicine name and logo. This heightened vigilance ensures that all digital properties adhere to regulatory standards, thereby minimizing potential legal risks and safeguarding the institution's reputation.The Penn Simplified Shield may also only be used on approved Penn Medicine social media accounts.

Do’s and don’ts

Do
  • Use approved assets only: Always source logos from the Penn Medicine Branding website to ensure consistency and quality.
  • Maintain minimum size and clear space: Logos should never appear smaller than 30px high on screen. Keep sufficient padding around the logo, based on the logotype’s x-height.
  • Ensure proper contrast: Use the logo on high-contrast backgrounds that meet WCAG accessibility standards.
  • Keep logos responsive: Test on multiple screen sizes to ensure the logo scales clearly and maintains integrity.
Don't
  • Don’t use the logo without the shield: The lockup must remain intact unless a specific variation is pre-approved (e.g., avatar use).
  • Don’t use unofficial or outdated versions: Avoid pulling logos from the web, screenshots, legacy marks, or recreated logos—always use the latest source files on the Penn Medicine Branding website.
  • Don’t alter or stylize: Avoid shadows, filters, animations, or changing internal proportions.
  • Don’t place logos on busy or gradient backgrounds:Use solid, neutral backgrounds to preserve clarity and impact.
  • Don’t distort the logo: Maintain aspect ratio; never stretch, compress, or pixelate.
  • Don’t use as decoration: The logo should never be used as a background graphic, watermark, or pattern.
  • Don’t co-brand without approval: Co-branding without prior authorization is strictly prohibited and may result in legal action.

Related resources

To learn more or download the logo, visit Penn Medicine Brand Standards

Contact

For more information about this standard, email: web-standards@pennmedicine.upenn.edu

Last updated

Date
Version
Desciption
06/11/25
1.0.0
Initial Release