Pattern Library

What

The City of San Diego's Pattern Library is a collection of design elements that can be applied to website projects. Its usage ensures a cohesive and consistent branding throughout the City's websites and web applications.

This site has three sections:

• Patterns - design elements with descriptions and applicable code
• Templates - sample web pages that consist of design elements
• Guidelines - best practices related to this library

Who

This pattern library should be referenced by anyone developing or updating a City of San Diego website or web application, including:

• City Web Team
• Department content editors
• CGI
• External web developers contracted with the City of San Diego

How

The following files must be applied to your project to use this pattern library.

• sand.min.css
• sand.js

For the developer's convenience, code examples are provided for most patterns and components. Simply copy the code and apply to your project. Variations are available for some elements and can be applied through helper or modifier classes.