Samaritan's Purse Content Delivery Network — Visual Reference Guide

Use this CDN to free-up space on your server, assure your project is using the correct styles and assets, and improve load times. With this index you'll be able to copy the correct paths to the files you need or download various assets for other uses. Use of assets is subject to the Samaritan's Purse Permissions of Use. Email ApplicationDevelopers@samaritan.org if you have any questions about the use of this CDN or need to report an issue.

Global — SP Logos

These are the official approved logos for use in your project. Be sensible about their use and please adhere to the usage suggestions provided for each asset.

  • Samaritan's Purse horizontal logo color
    samaritans-purse-logo-horiz-color.svg

    Use this logo on all Samaritan's Purse digital properties with a suitable background.

  • Samaritan's Purse horizontal logo black
    samaritans-purse-logo-horiz-black.svg

    Use this logo on all Samaritan's Purse digital properties with a light background.

  • Samaritan's Purse horizontal logo white
    samaritans-purse-logo-horiz-white.svg

    Use this logo on all Samaritan's Purse digital properties with a dark background.

  • Samaritan's Purse logo color
    samaritans-purse-logo-color.svg

    Use this logo when vertical space allows on all Samaritan's Purse digital properties with a suitable background.

  • Samaritan's Purse logo black
    samaritans-purse-logo-black.svg

    Use this logo when vertical space allows on all Samaritan's Purse digital properties with a light background.

  • Samaritan's Purse logo white
    samaritans-purse-logo-white.svg

    Use this logo when vertical space allows on all Samaritan's Purse digital properties with a dark background.

  • Samaritan's Purse icon color
    samaritans-purse-icon-color.svg

    Use this icon on all Samaritan's Purse digital properties with a suitable background.

  • Samaritan's Purse icon black
    samaritans-purse-icon-black.svg

    Use this icon on all Samaritan's Purse digital properties with a light background.

  • Samaritan's Purse icon white
    samaritans-purse-icon-white.svg

    Use this icon on all Samaritan's Purse digital properties with a dark background.

Return to the top

Global — SP Colors

Use these colors in the design of Global Samaritan's Purse digital properties. Do not use tint or shade derivitives of these colors. Instead you may include any value of neutral gray including black and white.

  • #798034

    Use the Samaritan's Purse gold color on all non-prose design elements.

  • #071b31

    Use the Samaritan's Purse blue color on all non-prose design elements.

Return to the top

Global — SP Fonts

Use these fonts and styles in the design and prose of Global Samaritan's Purse digital properties. Affect styles by declaring the desired font properties such as 300, 500, etc.

To include all SP global fonts, paste the following link into the head of your HTML document.

Roboto

  • Sp
    Roboto Thin

  • Sp
    Roboto Thin Italic

  • Sp
    Roboto Light

  • Sp
    Roboto Light Italic

  • Sp
    Roboto Regular

    This should be the default weight on all body copy.

  • Sp
    Roboto Regular Italic

  • Sp
    Roboto Medium

  • Sp
    Roboto Medium Italic

  • Sp
    Roboto Bold

  • Sp
    Roboto Bold Italic

  • Sp
    Roboto Black

  • Sp
    Roboto Black Italic

Return to the top

Roboto Condensed

  • Sp
    Roboto Condensed Regular

  • Sp
    Roboto Condensed Regular Italic

  • Sp
    Roboto Condensed Bold

  • Sp
    Roboto Condensed Bold Italic

Return to the top

Roboto Mono

  • 01
    Roboto Mono Regular

Return to the top

Roboto Slab

  • Sp
    Roboto Slab Regular

  • Sp
    Roboto Slab Bold

Return to the top

Global — SP Favicons

The following code and assets should be used so that the Samaritan's Purse brand icon displays clearly on all web, iOS, Android and Windows viewports.

Step 1

Paste the following code into the head of your HTML document.

Step 2

Download, expand and place the contents of sp-favicons.zip in the root of your project.

  • Apple Touch icon
    Apple Touch (180x180 .png)
  • SP Favicon 48x48
    SP Favicon (48x48 .ico)
  • SP Favicon 32x32
    SP Favicon (32x32 .png)
  • SP Favicon 16x16
    SP Favicon (16x16 .png)
  • Safari Pinned Tab
    Safari Pinned Tab (.svg)
  • Microsoft Tile
    Microsoft Tile (150x150 .png)
  • Android Chrome 256x256
    Android Chrome (256x256 .png)
  • Android Chrome 192x192
    Android Chrome (192x192 .png)

Return to the top

USA — SP Social Media

  • Facebook Icon
    facebook.svg

    Use this icon to link to Samaritan's Purse Facebook.

    Path to asset:

    URL to page:

  • Instagram Icon
    instagram.svg

    Use this icon to link to Samaritan's Purse Instagram.

    Path to asset:

    URL to page:

  • LinkedIn Icon
    linkedin.svg

    Use this icon to link to Samaritan's Purse LinkedIn.

    Path to asset:

    URL to page:

  • Pinterest Icon
    pinterest.svg

    Use this icon to link to Samaritan's Purse Pinterest.

    Path to asset:

    URL to page:

  • RSS Icon
    rss.svg

    Use this icon to link to Samaritan's Purse RSS.

    Path to asset:

    URL to page:

  • Twitter Icon
    twitter.svg

    Use this icon to link to Samaritan's Purse Twitter.

    Path to asset:

    URL to page:

  • YouTube Icon
    youtube.svg

    Use this icon to link to Samaritan's Purse YouTube.

    Path to asset:

    URL to page:

Return to the top

USA — OCC Logos

  • Operation Christmas Child Full Color Logo
    occ-logo-full-color.svg

    Use this logo on all Samaritan's Purse digital properties with a color-coordinated background.

  • Operation Christmas Child Black Logo
    occ-logo-black.svg

    Use this logo on all Samaritan's Purse digital properties with a light background.

  • Operation Christmas Child White Logo
    occ-logo-white.svg

    Use this logo on all Samaritan's Purse digital properties with a dark background.

Return to the top

Global — OCC Colors

Use these colors in the design of Global Operation Christmas Child properties. Do not use tint or shade derivitives of these colors. Instead you may include any value of neutral gray including black and white.

  • #C9161D

    Use the Operation Christmas Child red color on all non-prose design elements.

  • #008943

    Use the Operation Christmas Child green color on all non-prose design elements.

Return to the top

USA — OCC Extranet Icons

  • OCC Document Resources application Icon
    document-resources.svg

    Use this icon when linking to the OCC Document Resources application.

  • OCC Drop-Off Location Management application Icon
    drop-off-location-management.svg

    Use this icon when linking to the OCC Drop-Off Location Management application.

  • OCC Home application Icon
    home.svg

    Use this icon when linking to the OCC Extranet home screen.

  • OCC Leader Inbox application Icon
    leader-inbox.svg

    Use this icon when linking to the OCC Leader Inbox application.

  • OCC My Profile Settings application Icon
    my-profile-settings.svg

    Use this icon when linking to the OCC Extranet My Profile screen.

  • OCC National Partnership Resources application Icon
    national-partnership-resources.svg

    Use this icon when linking to the OCC National Partnership Resources application.

  • OCC Recommitment Dashboard application Icon
    recommitment-dashboard.svg

    Use this icon when linking to the OCC Recommitment Dashboard application.

  • OCC Reporting Center application Icon
    reporting-center.svg

    Use this icon when linking to the OCC Reporting Center application.

  • OCC Video Resources application Icon
    video-resources.svg

    Use this icon when linking to the OCC section of video.samaritanspurse.org.

  • OCC Volunteer Selection & Onboarding application Icon
    volunteer-selection-ampersand-onboarding.svg

    Use this icon when linking to the OCC Volunteer Selection & Onboarding application.

Return to the top

USA — USDR Icons

  • US Disaster Relief Icon Black
    us-disaster-relief-icon-black.svg

    Use this icon on light color backgrounds.

  • US Disaster Relief Icon White
    us-disaster-relief-icon-white.svg

    Use this icon on dark color backgrounds.

Return to the top

USA — USDR Colors

Use these colors in the design of US Disaster Relief digital properties. Only use the tint and shade derivitives of these colors shown below.

  • #FF6319 (Primary)

    Use the primary US Disaster Relief orange color on all non-prose design elements.

  • #292929 (Primary)

    Use the primary US Disaster Relief grey color on any design element.

  • #E2461C (Shade)

    Use this US Disaster Relief orange color on all non-prose design elements.

  • #D9421D (Shade)

    Use this US Disaster Relief orange color on all non-prose design elements.

  • #C2361E (Shade)

    Use this US Disaster Relief orange color on all non-prose design elements.

  • #EAEBEC (Tint)

    Use this US Disaster Relief grey color on any non-prose design element.

  • #E6E6E6 (Tint)

    Use this US Disaster Relief grey color on any non-prose design element.

  • #CECECE (Tint)

    Use the US Disaster Relief grey color on any design element.

  • #4D4D4D (Tint)

    Use the US Disaster Relief grey color on any design element.

Return to the top

USA - Required Links

  • USA Solicitation Disclosure

    Link to Samaritan's Purse solicitation disclosure from within projects released within the USA.

  • USA Privacy Policy

    Link to Samaritan's Purse privacy policy from within projects released within the USA.

Return to the top

USA - Required Text

  • USA Address

    Include the following address in all products produced for use within the USA.

  • USA Disclaimer

    Include the following disclaimer in any product which can be used to solicit donations to Samaritan's Purse.

Return to the top

Global - Required Links

  • Statement of Faith

    Link to the Samaritan's Purse Statement of Faith from within your project.

  • Mission Statement

    Link to the Samaritan's Purse Mission Statement from within your project.

Return to the top

Global - Required Text

  • Copyright

    Include this copyright on all projects.

Return to the top