This document outlines how to use the Google Classroom name, logo and icon. If you have any additional questions, please refer to the more general Google brand permissions.
Icon use guidelines
When you are integrating with Classroom, always use the Classroom icon (as opposed to the Google logo.) Make sure the Google Classroom icon is fully and clearly visible. You can use the icon with or without the accompanying text "Google Classroom". If you are using the Classroom icon along with other logos, make sure each has proper spacing for readability.
Sizes
The Classroom icon is available in a number of different sizes, from 32 to 96 pixels. You can scale the icon for different devices and screen sizes but must preserve the aspect ratio so the logo isn't stretched.
Square Logo
Round Logo
Describing Classroom
When using the Classroom icon, you can include either the full name "Google Classroom" or the short version "Classroom".
Example buttons:
Example padding:
When talking about Classroom classes, use one of these phrases (note that "classes" is not capitalized):
- Google Classroom classes (example: "Choose from your Google Classroom classes")
- Classroom classes (example: "Choose from your Classroom classes")
- Invite via Google Classroom
- Share with Google Classroom
- Share to Google Classroom
Do not use the following phrases:
- Google Classrooms
- Google classes
- Google Classes
- Google Class
- Invite Google Classroom
Describing your own product or application
If your product is compatible with Google Classroom, make reference to Google Classroom by using the text "for", "for use with", or "compatible with", and be sure to include the ™ symbol with the Google trademark. Example: "for Google Classroom™"
If you are making reference to a Google trademark in combination with your logo, the referencing text should be smaller in size than your logo.
Using screenshots
For illustrative or informative purposes, you may use standard, unaltered screenshots of Google services. For further details, check out the general Google Brand Permissions.
Giving proper attribution
Do give proper attribution to Google for any use of their marks in your application title or in your description. Example: Google Classroom is a trademark of Google Inc. Use of this trademark is subject to Google Brand Permissions.
Font
Use Roboto Bold, a TrueType font.
To install, download Roboto font and unzip the download bundle.
- On Mac, double-click Roboto-Bold.ttf, then click "Install Font".
- On Windows, drag the file to "My Computer" > "Windows" > "Fonts" folder.
Colors
- Classic icon
- The green color of the Google Classroom icon is #25A667
- The yellow color of the Google Classroom icon is #F6BB18
- The white color of the Google Classroom icon is #FFFFFF
- The green secondary color of left and right person in Google Classroom icon is #57BB8A
- Dark icon
- The black color of the Google Classroom icon is #000000
- The white color of the Google Classroom icon is #FFFFFF
- The grey secondary color of left and right person in Google Classroom icon is #57BB8A
- Light icon
- The green color of the Google Classroom icon is #25A667
- The yellow color of the Google Classroom icon is #F6BB18
- The green secondary color of left and right person in Google Classroom icon is #57BB8A
Hover state
On hover the icon should be shaded with 20% black.
Incorrect logo design
- Don't use colors other than the two specified for the icon.
- Don't use a Google icon to represent Google Classroom.
- Don't create your own icon for the button.
- Don't use the term "Google" by itself in the button without a Google Classroom icon.
- Examples of incorrect Google Classroom button designs:
Never use the colored Google logo in the button. Always include the Google Classroom icon on the left of the button. Do not change the font of the button.