Applies to

Brandfolder
  • Brandfolder

Capabilities

Who can use this capability

  • Admins

Set up your Content Automation brand

Learn how to set up your Content Automation brand.

Who can use this?

Plans:

  • Brandfolder

Permissions:

  • Admins

Find out if this capability is included in Smartsheet Regions or Smartsheet Gov.

A brand system is a design management tool within Content Automation. It's where you can define your logos, colors, typography, and anything necessary to your brand. The brand system then codifies those values for developers to use in design systems, applications, websites, and templates.

To set up your brand in Content Automation:

  1. Head to Settings > Brand System.
  2. Switch to Colors, Logos, Typography, or Tokens in the sub-menu, depending on the brand element you want to set up first.

Colors

To add colors to your brand system:

  1. Select New Color. If you previously had colors in the your brand area, choose Import from Account Settings.
  2. Give the color a name.
  3. Enter the HEX, RBG, or CMYK value for your color. HEX and RGB always reference the same color. But you can choose to unlink CMYK and add your values if desired.
  4. Enter the SPOT value if known.
  5. Select Finish editing after adding all colors. 

To organize brand colors into color palettes:

  1. Select New palette.
  2. Select New color. Give the palette a name.
  3. Choose the existing color you'd like to add to your palette. If you select the wrong color, remove it from the palette by choosing the ellipses (⋯) next to the color, followed by Delete
  4. If you'd like to re-order colors, click and drag the 6-dot icon next to the color name. 
  5. Select Finish editing after adding all color palettes.

Logos

Add logos to your brand system:

  1. Ensure your logos have been uploaded to the account asset library. Then head back to Account Settings > Brand System > Logos.
  2. Select New logo set
  3. Give the logo set a name.
  4. Select New logo
  5. Give the logo a name.
  6. Select Change.
  7. Search for the logo you previously uploaded/checked in the asset library in step 1.
  8. Choose which background the logo should be displayed on white, grey, or black. 
  9. Confirm Finish editing after adding all logos

Typography

To add a typeface to your brand system, select Typeface then follow the applicable steps. 

Custom font upload

  1. Select Upload on the newly created typeface to open the upload font modal.
  2. Name your font here and drop in or browse locally for custom font files to upload as a single typeface or font family. For example, you could create a Helvetica typeface and upload a light, medium, medium italic, bold and black font file to be saved to that typeface. 
  3. Once added to the upload font form, a weight and style value needs to be set for each font. To ensure support for drag & drop templates the numerical value must be set.

100 = Thin

200 = Extra Light / Ultra Light

300 = Light

400 = Regular

500 = Medium

600 = Semi-bold / Demi-bold

700 = Bold

800 = Extra-bold / Ultra-bold

900 = Black

Important: 

  • Styles can be set as normal, italic or underline for each uploaded file.
  • Font files must be under 50MB for successful upload. Consider using font files that are less than 5MB for the best possible end user experience when creating assets in a browser.
  • OTF, TTF, WOFF & WOFF2 font formats are supported. 
  • Non-standard weights (any not covered in the above list) are not supported.
  • Heavily customized fonts may have compatibility issues with browser and rendering technologies
  1. Select Create Font to finalize creation of the new Typeface (Font Family).

Custom font uploads are also automatically available for InDesign Templates and supported for Coded Templates, Drag & Drop Templates and InDesign Templates.

Adobe Fonts

  1. Select the split button arrow next to Upload on the new typeface.
  2.  Enter your Adobe Fonts URL. It must have a typekit.net URL form.
  3. By linking an Adobe Font, customers guarantee that they have appropriate licensing to to utilize the font in Templates.
  4. Select Add Source to submit.

Supported for Coded Templates and Drag & Drop Templates only. 

Google Fonts

  1. Select Google Font from the split button arrow on the upload button
  2. Search for a Google Font in the provided text field. It is a search panel linked to the Google Fonts API.
  3. Select the required font and select Add Source

Supported for Coded Templates and Drag & Drop Templates only.

Add type scale

  1. Select New type scale
  2. Give the type scale a name.
  3. Specify type scale details, including size (rem), font weight, line height, letter spacing, and rich treatments like underlining or italics. 
  4. Confirm Finish editing after adding all type scales.

Tokens

To add tokens to your brand system:

  1. Select New token type.
  2. Give the token type a name. Token types are a way to group similar tokens.
  3. Select Add set
  4. Give the set a name. Token sets are a way to group tokens within a type. 
  5. Then select Add token
  6. Enter token details - name, key, and value. The name can be used as a way to identify a token quickly. The key is the shorthand developers can use to reference the token. And the value is the token information.
  7. Confirm Finish editing.