Icon Font

The CaGov icon font includes 102 icons you can use in your site. Four different formats of the font are included for compatibility with all popular browsers. You may need to add a mime map to your webserver for the WOFF font. To determine if your webserver needs it, upload the /fonts/CaGov.woff file to your webserver. Try downloading the WOFF in your browser by visiting: http://yourwebsite.ca.gov/fonts/CaGov.woff . If it prompts you to download the font, your server is configured correctly. If you get a 404 or other error, you'll need to add a mime map for extension ".woff", and the mimetype is "application/font-woff". Ask your server admin if you need assistance.

To insert an icon into your page, insert an empty span tag with two class names, for example:

<h2><span class="add_icon_font_heading ca-gov-icon-Arrow-Right"></span>Heading</h2>

will appear as:

Heading

See /index.html for more examples.

The first class is used to select the CaGov font. There are two options:

add_icon_font_heading — For use with H1 to H5 headings. Styles for font-size and color are included.

or

add_icon_font_normal — For any other uses. You'll need to add styles for the font-size and color.

The second class specifies which icon to insert:

Code Icon Class Name
e600 ca-gov-icon-Ca-Gov-Logo
e601 ca-gov-icon-Ca-Gov-Home
e602 ca-gov-icon-Ca-Gov-Menu
e603 ca-gov-icon-Ca-Gov-Apps
e604 ca-gov-icon-Ca-Gov-Search
e605 ca-gov-icon-Ca-Gov-Chat
e606 ca-gov-icon-Ca-Gov-Capitol
e607 ca-gov-icon-Ca-Gov-State
e608 ca-gov-icon-Ca-Gov-Phone
e609 ca-gov-icon-Ca-Gov-eMail
e60a ca-gov-icon-Ca-Gov-Calendar
e60b ca-gov-icon-Ca-Gov-Bear
e60c ca-gov-icon-Law-Enforcement
e60d ca-gov-icon-Justice-Legal
e60e ca-gov-icon-At-Sign
e60f ca-gov-icon-Attachment
e610 ca-gov-icon-Zipped-File
e611 ca-gov-icon-PowerPoint
e612 ca-gov-icon-Excel
e613 ca-gov-icon-Word
e614 ca-gov-icon-PDF
e615 ca-gov-icon-Share
e616 ca-gov-icon-Facebook
e617 ca-gov-icon-LinkedIn
e618 ca-gov-icon-YouTube
e619 ca-gov-icon-Twitter
e61a ca-gov-icon-Pinterest
e61b ca-gov-icon-Vimeo
e61c ca-gov-icon-Instagram
e61d ca-gov-icon-Flickr
e61e ca-gov-icon-Microsoft
e61f ca-gov-icon-Apple
e620 ca-gov-icon-Android
e621 ca-gov-icon-Computer
e622 ca-gov-icon-Tablet
e623 ca-gov-icon-Smartphone
e624 ca-gov-icon-Roadways
e625 ca-gov-icon-Travel-Car
e626 ca-gov-icon-Travel-Air
e627 ca-gov-icon-Truck-Delivery
e628 ca-gov-icon-Construction
e629 ca-gov-icon-Bar-Chart
e62a ca-gov-icon-Pie-Chart
e62b ca-gov-icon-Graph
e62c ca-gov-icon-Server
e62d ca-gov-icon-Download
e62e ca-gov-icon-Cloud-Download
e62f ca-gov-icon-Cloud-Upload
e630 ca-gov-icon-Shield
e631 ca-gov-icon-Fire
e632 ca-gov-icon-Binoculars
e633 ca-gov-icon-Compass
e634 ca-gov-icon-SOS
e635 ca-gov-icon-Shopping-Cart
e636 ca-gov-icon-Video-Camera
e637 ca-gov-icon-Camera
e638 ca-gov-icon-Green
e639 ca-gov-icon-Loud-Speaker
e63a ca-gov-icon-Audio
e63b ca-gov-icon-Print
e63c ca-gov-icon-Medical
e63d ca-gov-icon-Zoom-Out
e63e ca-gov-icon-Zoom-In
e63f ca-gov-icon-Important
e640 ca-gov-icon-Chat-Bubbles
e641 ca-gov-icon-Phone
e642 ca-gov-icon-People
e643 ca-gov-icon-Person
e644 ca-gov-icon-User-Id
e645 ca-gov-icon-Payment-Card
e646 ca-gov-icon-Skip-Backwards
e647 ca-gov-icon-Play
e648 ca-gov-icon-Pause
e649 ca-gov-icon-Skip-Forward
e64a ca-gov-icon-Mail
e64b ca-gov-icon-Image
e64c ca-gov-icon-Home
e64d ca-gov-icon-Gear
e64e ca-gov-icon-Tool
e64f ca-gov-icon-Time
e650 ca-gov-icon-Calendar
e651 ca-gov-icon-Check-List
e652 ca-gov-icon-Document
e653 ca-gov-icon-Clipboard
e654 ca-gov-icon-Page
e655 ca-gov-icon-Read-Book
e656 ca-gov-icon-CC-Copyright
e657 ca-gov-icon-Ca-Capitol
e658 ca-gov-icon-Ca-State
e659 ca-gov-icon-Favorite
e65a ca-gov-icon-RSS
e65b ca-gov-icon-Road-Pin
e65c ca-gov-icon-Online-Services
e65d ca-gov-icon-Link
e65e ca-gov-icon-Magnify-Glass
e65f ca-gov-icon-Key
e660 ca-gov-icon-Lock
e661 ca-gov-icon-Info
e662 ca-gov-icon-Arrow-Up
e663 ca-gov-icon-Arrow-Down
e664 ca-gov-icon-Arrow-Left
e665 ca-gov-icon-Arrow-Right