Style

Digital Style Guide


Colors

#9d2329
#19384f
#eaf1f6

#6393b7
#ced6e0

Typography

Fonts

Poppins Extra Bold is used for headings. Nunito Sans is used for body copy.

Headings

Primary heading (“Heading 1”)

Secondary heading (“Heading 2”)

Tertiary heading (“Heading 3”)

Heading 4

Heading 5
Heading 6

Paragraph text. Cookie jelly beans wafer gummi bears cheesecake liquorice. Caramels sesame snaps topping sweet roll toffee tiramisu gummi bears. Caramels cake jelly-o.

Lists

Unordered list
  • Ice cream bonbon.
  • Marzipan gummies.
  • Fruitcake chocolate bar bonbon.
  • Donut soufflé icing dessert carrot cake lollipop fruitcake jelly beans.
  • Candy canes gummies bonbon cupcake cookie chupa chups.
  • Bear claw cake fruitcake tart pudding.
Ordered list
  1. Marzipan marzipan.
  2. Pudding candy pastry lollipop cheesecake bear claw.
  3. Cake cheesecake pudding croissant.
  4. Pudding cupcake tart gummies tootsie roll danish.
  5. Icing chocolate cake pie jelly-o.
  6. Chocolate bar cookie sweet roll jelly beans.
  7. Caramels.
  8. Cotton candy powder jujubes bonbon marshmallow jelly candy canes.
  9. Sweet croissant sugar plum pie jujubes chupa chups wafer. Carrot cake biscuit bonbon.

Blockquotes

Cookie jelly beans wafer gummi bears cheesecake liquorice. Caramels sesame snaps topping sweet roll toffee tiramisu gummi bears. Caramels cake jelly-o.

Links

A standard link. A link within a sentence. A visited link.

UI components

Buttons

This is the primary button, used for calls to action. Use on top of white or light grey backgrounds. Avoid placing this red button on top of a blue background.

You can access this button inside Page Builder by going to Modules and selecting the Button module.


Primary Button

You can also access this button without activating Page Builder on a page or post by using a little bit of code. Copy and paste the following code into the Text tab of any text editor.

Replace the # with the url you want to link to, and change the button text.

<a href="#">Read more</a>

Read more

Optimize Images

Before uploading an image to the website, please be sure the image has been optimized. We highly recommend this free, online resource: http://optimizilla.com

Image Sizes

Throughout the website, we are using different image sizes. Below we’ll outline the image sizes for each of the landing pages of the website.

Please note: Once an image is uploaded and resized by WordPress, if you are not liking how a particular image is looking, then we’d suggest editing that photo directly in photoshop or use an image editor to achieve the desire look for the image.

  • Homepage Header Image
    • Size 1920px  x 680px
  • Landing Page Full Width Header Images
    • Size 1920px x 550px
  • Provider Tools preview images
    • Size 427px × 320px
  • People featured images
    • Size 360px x 450px

Join us at the 25th Cardiovascular Nursing Symposium

Attend the live meeting or join us via the webcast.