Your one-stop shop for all branding information, conveniently gathered here for easy handoff to your branding team.

​
Image Assets

Image AssetDetailsSetting Location
Community Horizontal LogoUsed in certain generated marketing images to represent your community. Recommended to use a combination logo image containing the brand logo and/or title.
Recommended size is 70 px height, width between 70 - 240 px. Max 2 MB file size, 1500 x 1500 px resolution.		General under Community module
Community IconUsed as the icon of the Tightknit bot user when it sends messages to community members. Recommended dimensions 48 x 48 px.
By default, it is the Slack workspace icon. Can also be configured as the profile photo for bot users.		General under Community module
Site Horizontal LogoAppears in the top navigation bar. Recommended to use a combination logo image containing the brand logo and/or title.
Recommended size is 70 px height, width between 70 - 240 px. Max 2 MB file size, 2000 x 2000 px resolution.		General under Companion Forums Site module
Site IconAppears in the top navigation bar alongside the site name, only if there is no Site Horizontal Logo. Recommended dimensions 48 x 48 px. Max 2 MB file size.
By default, it is the Slack workspace icon. Can also be configured as the profile photo for bot users.		General under Companion Forums Site module
FaviconAppears next to the site title in your browser tab. Recommended dimensions 32 x 32 px.General under Companion Forums Site module
Social Media ImageAppears when a link to the site is shared on social media. All other pages will use this by default, unless overridden.
Recommended dimensions 1200 x 627 px. Max 4 MB file size, 1500 x 1500 px resolution.		General under Companion Forums Site module
Home page bannerRecommended dimensions of at least 827 x 192 px. Very tall images may be clipped. Max 4 MB file size.Home Page under Companion Forums Site module
Feed bannersRecommended dimensions of at least 827 x 192 px. Very tall images may be clipped. Max 4 MB file size.Feed create/update panel, accessible by the ••• menu next to feeds
Event cover imagesRecommended dimensions 600 x 338 px. Must have 16:9 aspect ratio.Event create/update panel, accessible by the ••• menu next to the event in the Events List modal
Blog post cover imagesRecommended 16:9 aspect ratio with dimensions at least 480 x 270 px.The first image attachment of a Slack message synced to the companion site as a Blog-type post
Badge images (Awards)Recommended dimensions 500 x 500 px. Max 2 MB file size, 1500 x 1500 px resolution.Award create/update panel
Profile frame images (Awards)Used as profile photo overlays for users that earn an Award. Use a square PNG image with transparency. Recommended dimensions 512 x 512 px. Max 2 MB file size, 1500 x 1500 px resolution. We recommend making all your Badge frames the same size and shape so that users can easily generate new frames repeatedly on top of their profile photos.Award create/update panel
Certificate template (Awards)Used as the background template when generating credentials / certificates for users that have earned an Award. Required dimensions 1500 x 1125 px. Max 2 MB file size. Use our Certificate Template for precise locations of the generated name and date sections.Award create/update panel
Gamification Background ImageUsed as the background for Social Media announcement style images, such as earning awards for users. Recommended dimensions of 1200 x 600 px. Max 2 MB file size, 1500 x 1500 px resolution.Settings under Gamification module

​
Branding Sets

A branding set is a collection of branding token values that work with our design system. You can access your branding sets by clicking on the Branding button under the Companion Site section of the admin settings. You can have up to 4 branding sets, with only one configured as the active branding set for your companion site.

The Default Branding Set cannot be deleted.

​
Colors

NameDescriptionVisual Guide
Paragraph Text ColorThe color of all non-header text
Header Text ColorThe color of header text, including:
• the site name
• section headers
• card headers
• post titles
Link Text ColorThe color of certain anchor link text, including:
• author profile links
• event links
Brand Color - PrimaryThe default color for primary buttons and certain other page elements, including
• navigation menu items: active & hover
• certain accent colors
• profile badges
• profile page backdrop
Brand Foreground Color - PrimaryThe color of text within primary buttons and certain other page elements affected by Brand Color - Primary
Brand Color - SecondaryThe default color for secondary buttons and certain other page elements, including
• pills
Brand Foreground Color - SecondaryThe color of text within primary buttons and certain other page elements affected by Brand Color - Secondary
Background ColorThe background color of the pages
Navigation Header Background ColorThe background color of the top navigation header bar
Card Background ColorThe background color of card sections, including:
• info sections
• feed posts
• post detail pages
• profile / event / feed list cards
Color values must be a valid hex code in the format #RRGGBBB.

Was this page helpful?