Style Guide

Brand Standards

All official UAMS communications should create brand continuity by using proper logos, colors and wordmarks.

Applying brand standards allows our target audiences to immediately recognize UAMS in the marketplace.

Websites at UAMS should have four key requirements.

  • Identity: A strong brand that allows visitors to immediately recognize a website belongs to UAMS.
  • Usability: Websites must be easy to use, navigate, and understand.
  • Consistency: Consistency improves the end users experience.
  • Accuracy: Pages must be accurate and up-to-date.

Any website that represents UAMS or its official units, programs, departments, or colleges is expected to follow this web style guide.

Please review these guidelines before creating any new web content.

Primary Colors

UAMS Red
#9d2235

Base & Text
#212121

Accent Shade
#e0e0e0

Accent Colors

Accent colors provide additional style to pages looking for a more modern flair. These colors are built into theme elements such as buttons and should be used to highlight important features on a page. They should be used sparingly and never draw the eye to more than one piece of information at a time. Shade color variations are used to represent states such as hover, active and focus. These variations are not used as accent colors and are shown only for comparison. In the examples below, UAMS Red is used to demonstrate its shade color variations.

Darkest
#7b1d2a

Dark
#8d1f30

UAMS Red
#9d2235

Light
#ad253a

Lightest
#bd2940

Darkest
#18506d

Darker
#1b5b7d

Dark
#1f678d

Blue
#22739d

Light
#257fad

Lighter
#298bbd

Lightest
#2c96cd

Darkest
#186d35

Darker
#1b7d3d

Dark
#1f8d45

Green
#229d4d

Light
#25ad55

Lighter
#29bd5d

Lightest
#2ccd65

Background Colors

These colors are used largely for background blocks and large content areas. When alternating between tones, be sure to use enough contrast between adjacent colors.

Darkest
#212121

Darker
#424242

Dark
#616161

Accent Shade
#e0e0e0

Light
#eeeeee

Lighter
#f5f5f5

Lightest
#fafafa

Special State Colors

These colors are used for accessibility of content.

Links
#1565c0

Link Hover
#9d2235

Link Visited
#4527a0

Special Use Colors

These colors are only used for the UAMS alert system.

Yellow – Focus
#ffb81c

Red – Urgent
#C61029

Orange – Alert
#ec7330

Steel – FYI
#597286

Sample Elements

Want to see what a blockquote looks like?

This is an example of a WordPress post, you could edit this to put information about your site so readers know where you are coming from. You can create as many posts as you like in order to share with your readers what is on your mind.

Perhaps you’d like to see what an unordered list looks like?

  • Unordered list item #1
  • Unordered list item #2
  • Unordered list item #3

Or you’d prefer to see what an ordered list looks like?

  1. Ordered list item #1
  2. Ordered list item #2
  3. Ordered list item #3

Care to see what the headings look like?

Headline 1

Headline 2

Headline 3

Headline 4

Headline 5
Headline 6

Interested in using buttons on your site?

Default Button
Blue Button
Green Button
Yellow Button
Gray Button
Red Button