University of Southern California

USC Identity Guidelines

Websites

School and department websites must include a USC logo in the top right corner of each page with a link back to the USC homepage. For visitors, this logo serves as a consistent and reassuring landmark throughout the university’s web presence. The size, position, color, and spacing of the logo should be as specified below.

USC logo graphic

The web logo uses the primary logotype (shield + wordmark). Its dimensions are 176 x 38 pixels, and the required minimum clear space surrounding it on all sides is 11 pixels, for a total size of 198 x 60 pixels. When other logos or links are placed near the graphic in the website’s header, be careful to provide separation between the USC logo and these other elements – for example, by adding clear space or by defining different areas using backgrounds.

Download graphics

Approved colors

The background color behind the USC logo should be USC cardinal, black, or white. Note that the color specifications are different for printed materials, and only the screen versions should be used. Here are approved color combinations:

The background color behind the graphic may also be a subtle gradient of an approved color. In this case, the hue should remain constant and brightness should transition smoothly and no more than 20% from one end of the gradient to the other. For example, a gradient using a cardinal background could transition from #CC0000 to #990000 or from #990000 to #660000, but not from #CC0000 to #660000 (which is 50%).

For the sake of legibility, the USC logo should never be placed on photographic or patterned backgrounds.

Examples

The USC logo is meant to integrate well with website designs, rather than diminishing their appearance or seeming tacked-on. The logo uses minimal space to provide visitors with immediate awareness of a website’s university affiliation, while building name recognition and a unified image for USC and its schools and other units.

Browse the examples below to see various ways to implement these guidelines.

Code samples

<style type="text/css">
h1#usclogo {
	float: right;
	width: 198px;
	height: 60px;
	margin: 0;
}
h1#usclogo a {
	display: block;
	width: 176px;
	height: 38px;
	padding:11px;
	background-color:#900 // cardinal
	background:url(usc-shield-name-white.png) 0 11px no-repeat;
	text-indent: -9999px;
}
</style>
<h1 id="usclogo"><a href="http://www.usc.edu/">University of Southern California</a></h1>

If you have questions, need help implementing the web identity standards or have special circumstances that prevent the identity standards from working on your website, please contact USC Web Services at webhelp@usc.edu.

  • Reference links