Anchore

📋 1 Guidelines

🔗 Connections

Sector

Cybersecurity Software

Region

Usa

Guideline Year

2021

Language

English

Tags

Security Software

Official Websites

Brand Guidelines

2021

Brand Summary

Mission
  • Anchore provides stability in a fluid world, focusing on security, software supply chain, containers, integration, and automation. The brand aims to present a consistent image to its various audiences through disciplined and approachable design [^1].
Core Values
  • modularity
  • stability
  • fluidity
  • discipline
  • approachability
  • security
  • integration
  • automation
Target Audience
  • Software vendors, internal teams, customers, and the public sector, with an emphasis on those involved in software supply chain and container security [^2].
Personality Traits
  • disciplined
  • approachable
  • stable
  • modern
  • professional
Visual Identity Overview
  • Anchore’s visual identity is minimalistic and modern, using a consistent logo, color palette (primarily Anchore Blue, Black, Soft White, and accent colors), Poppins typography, disciplined layout, and clear guidelines for photography, iconography, and graphic elements. The brand emphasizes clarity, simplicity, and consistency across all visual touchpoints [^3].

Categories

Brand Imagery
  • Anchore utilizes photography in design to support web based content such as biogs, case studies, web pages, etc. Images should be selected following these guidelines to create consistent, meaningful design.
  • Avatars are used to represent personas, users, or team members -either in their own likeness (e.g. Said Ziouani) or abstractly (e.g. DevOps Engineer).
  • Lifestyle photography portrays a person or people interacting with objects or others around them. It is Anchore’s primary photography style -as it can effectively communicate humanness, authenticity, and emotion in a digital world.
  • Still life photography is a useful secondary photo style, often used when illustrating general concepts such as containers, security, or automation.
  • While the perfect photo may not exist, these guidelines are meant to help in selecting strong photos. Follow these guidelines as closely as possible, but trust your own eye and intuition when weighing the strength of a photo. 1. Support the content
  • The primary purpose of an image in design is to support the content. Select photos that engage the user but don’t detract or distract from the content within a design. Maintain a consistent theme between the copy, graphics, and images on a page.
  • Focus and harmony apply to photos both in their concept and visually. “What is this photo about?” is easily answered in a well focused image. A harmonious image has visual consistency and directs a user to a single point within the image.
  • Use photos of the real, physical world. If you are unsure, ask yourself if the photo would require a design tools to create (e.g. Photoshop), or if you could recreate the photo with just a camera.
  • Photos should be well lit, in focus, and high quality. Avoid using images with pixelation, visual distortion, or artificial lighting (e.g. colored lights).
  • Avatar photos are people with a casual to happy expression in casual to semi-formal attire. Look for photos with good contrast between the subject and the background to make background removal easier.
  • Avatars representing personas or users should have their background removed and transparent. Stickermule provides a free tool to remove an image background.
  • After the background is removed, the image should be placed on one of Anchore’s accent or gradient colors. Avatars are typically displayed as round images, but should also be composed to work in a square format.
  • Lifestyle photography captures an individual or group interacting with their environment. These photos are most effective at engaging a viewer with the content the image supports.
  • Photos of humans should retain a human touch. Emotion is one of the most powerful tools in photography. Try to find images that capture an emotion the audience can connect with and that supports the content. Avoid photos that only show a hand or arm or people facing away from the camera.
  • Avoid staged or overly dramatic photos. While in reality many photos are staged, aim for photos that capture people interacting and positioned in a natural way, in realistic environments.
  • Use photos that include a diverse audience. Especially when working to create a collection of photos (e.g. biogs) ensure that a selected photo complements and continues to diversify the collection.
  • Still life photographs are a great way to communicate digital concepts such as containers, security, or automation using objects or scenes from the physical world.
  • Photos should be of the real world, without added objects or graphics. Edits are acceptable, but should always enhance -the best edits are not noticeable.
  • The photo should have a single focal point or subject. In general stay away from repeating patterns, solid surfaces, or abstract spaces. Keep in mind that the subject of a photo does not have to be one-to-one with a title or headline.
Color Palette
  • The logo displayed in Anchore Blue, Black, or Soft White to provide appropriate contrast in each context. Anchore’s logo is used primarily in its Anchore Blue format when on white or a very light color background. A Soft White logo may be used on a medium to dark colored background. A black logo can be used in a black and white only setting.
  • Color is a key piece to any brand. Anchore aims to use color intentionally to help communicate a message, a mood, and a meaning. Each brand color can be used at varying opacity, never less than 50%, and following an acceptable Color Combination. Anchore Blue is the primary brand color. Darkmode Blue is reserved for dark backgrounds.
  • Anchore Blue HEX: #OE40CO RGB: 14, 64, 192 CMYK: 100, 83, 0, 0
  • Black HEX: #OF131F RGB: 15, 19, 31 CMYK: 82, 74, 57, 75
  • Soft White HEX: #F2F5F8 RGB: 242, 245, 248 CMYK: 4, 2, 1, 0
  • Darkmode Blue HEX: #3E66CD RGB: 62, 102, 205 CMYK: 88, 63, 0, 0
  • Gray shades are used for backgrounds, text, and other elements that don’t require color. Anchore relies on grays and white for the majority of design to allow colors to stand out.
  • Darkmode Black HEX: #20242E RGB: 32, 36, 46 CMYK: 79, 71, 56, 65
  • Dark Gray HEX: #333742 RGB: 51, 55, 66 CMYK: 76, 68, 52, 48
  • Slate Gray HEX: #9AA7BC RGB: 154, 167, 188 CMYK: 41, 29, 16, 0
  • Pure White HEX: #FFFFFF RGB: 255, 255, 255 CMYK: 0, 0, 0, 0
  • Accent colors are used sparingly to create variation, focus attention, or differentiate items. They should not be used as background colors for paragraph text or for the text itself. Accents are used with varying opacity, never less than 50%.
  • Yellow HEX: #F9D571 RGB: 249, 213, 113 CMYK: 2, 16, 73, 0
  • Orange HEX: #F6AB89 RGB: 246, 171, 137 CMYK: 1, 45, 50, 0
  • Green HEX: #99E1CF RGB: 153, 225, 207 CMYK: 46, 0, 30, 0
  • Blue HEX: #82BCF9 RGB: 130, 188, 249 CMYK: 55, 15, 0, 0
  • Purple HEX: #D1B2FA RGB: 209, 178, 250 CMYK: 27, 36, 0, 0
  • Pink HEX: #E88199 RGB: 232, 129, 153 CMYK: 5, 69, 25, 0
  • Accent Darkmode colors are used in dark mode settings on Background Black.
  • Darkmode Yellow HEX: #FEDFBl RGB: 254, 223, 177 CMYK: 0, 13, 33, 0
  • Darkmode Orange HEX: #EDBBA1 RGB: 237, 187, 161 CMYK: 5, 32, 33, 0
  • Darkmode Green HEX: #B7E4DA RGB: 183, 228, 218 CMYK: 32, 0, 22, 0
  • Darkmode Blue HEX: #95C8E5 RGB: 149, 200, 229 CMYK: 39, 9, 4, 0
  • Darkmode Purple HEX: #B8A7D4 RGB: 184, 167, 212 CMYK: 27, 33, 0, 0
  • Darkmode Pink HEX: #E593A6 RGB: 229, 147, 166 CMYK: 6, 57, 25, 0
  • Gradient colors are used as background colors only. Individual gradient stops are used for sequential or diverging data sets and diagrams. Blue-Blue has a set direction of 135deg. All other gradients use either 180deg or Odeg.
  • Color must be appropriately applied to elements to ensure a minimum required contrast ratio and brand consistency. Below are acceptable color combinations for text and backgrounds. Only use these combinations for text when designing interfaces that require user comprehension.
  • Soft White on Blue
  • Soft White on Blue-Blue
  • Soft White on Darkmode Blue
  • Black on Blue-Yellow
  • Black on Blue-Orange
  • Black on Blue-Green
  • Black on Blue-Purple
  • Color must be appropriately applied to elements to ensure a minimum required contrast ratio and brand consistency. Below are acceptable color combinations for text and backgrounds. Only use these combinations for text when designing interfaces that require user comprehension -Pure White should not be used for text on dark backgrounds. Soft White on Black Soft White on Darkmode Black Black on Soft White
  • Black on Frost White
  • Black on Pure White
  • Pure White text on dark backgrounds 0 Don’t use Pure White for text in any situation.
  • Blue or accent colors for text 0 Don’t use blue or accent colors for text
  • Accent colors as text background €Don’t use accent colors as backgrounds for text.
  • sll ml Gray over gradient O Don’t use accent colors over gradient backgrounds. Don’t use light text over gradients.
Typography
  • Anchore corporate design uses the Poppins font family as its primary typeface. Poppins Regular is used for body copy. Poppins Medium and Semibold are for headlines, subheads, and quotes.
  • Web typography is both responsive and adaptable to account for multi-device experiences. The Anchore brand embraces a disciplined hierarchy of typography to ensure the content is readable, accessible, and attractive on web and print.
  • Heading 1 Font Size: 80px Weight: SemiBold (600) Line Height: 76px Letter Spacing: -5%
  • Heading 2 Font Size: 68px Weight: SemiBold (600) Letter Spacing: -4%
  • Heading 3 Font Size: 48px Line Height: 48px Weight: SemiBold (600) Letter Spacing: -4%
  • Subheading Large Font Size: 32px Line Height: 40px Weight: SemiBold (600) Letter Spacing: -1%
  • Subheading Regular Font Size: 24px Line Height: 32px Weight: Regular (400) Letter Spacing: 0%
  • Body SemiBold Font Size: 20px Line Height: 28px Weight: Semi Bold (600) Letter Spacing: 0%
  • Body Regular Font Size: 20px Line Height: 32px Weight: Regular (400) Letter Spacing: 0%
  • Body Small Font Size: 14px Line Height: 18px Weight: Regular (400) Letter Spacing: 0%
  • Body Small Font Size: 16px Line Height: 22px Weight: Medium (500) Letter Spacing: 0%
  • Body Small Font Size: 16px Line Height: 26px Weight: Regular (400) Letter Spacing: 0%
  • Link Medium
  • Link Regular Caption
  • Font Size: 14px Line Height: 24px Weight: Regular (400) Letter Spacing: 1%
  • Tabs Font Size: 14px Line Height: 16px Weight: Medium (500) Letter Spacing: -1%
  • Tabs Font Size: 14px Line Height: 24px Weight: SemiBold (600) Letter Spacing: 5%
  • Tabs Font Size: 14px Line Height: 24px Weight: Regular (400) Letter Spacing: 5%
  • Designing for a cross-media experience means typography needs to be both responsive and adaptable. In order to create an equally appealing experience on the web as in print, the Anchore brand embraces a disciplined hierarchy of typography by ensuring the content is readable, accessible, and attractive.
  • Heading 1
  • Heading 2
  • Heading 3 Font Size: 36px Line Height: 42px Weight: SemiBold (600) Letter Spacing: -3%
  • Heading 2 Font Size: 26px Line Height: 32px Weight: SemiBold (600) Letter Spacing: -3%
  • Heading 3 Font Size: 18px Line Height: 24px Weight: SemiBold (600) Letter Spacing: -3%
  • Subheading Font Size: 14px Line Height: 20px Weight: Regular (400) Letter Spacing: 0%
  • Body Font Size: 12px Line Height: 16px Weight: Regular (400) Letter Spacing: 0%
  • Caption Font Size: 10px Line Height: 14px Weight: Regular (400) Letter Spacing: 0%
Logo Usage
  • Anchore’s logo is the unique graphic symbol that distinguishes the brand from all others. Use of the logo, typography, and color should follow the guidelines within this document so that Anchore presents a consistent image to its various audiences.
  • The shorthand mark is a representation of what Anchore provides: stability in a fluid world. It uses the same elements as the standard logo—modularity, stability, and fluidity—but in an abbreviated format. The Anchore mark should only be used to complement the full logo and should not be used in any context where the full logo is not seen first.
  • To maintain the integrity of the Anchore identity, keep a fixed amount of open space around the entire logo to help it stand out. An appropriate clearspace for the logo is equal to half the height of the “a” (marked as x in the diagram)
  • For readability, do not scale the logo or shorthand mark below these minimum sizes. The standard logo should be no smaller than 72px wide. The shorthand mark should be no smaller than 12px wide.
  • The logo displayed in Anchore Blue, Black, or Soft White to provide appropriate contrast in each context. Anchore’s logo is used primarily in its Anchore Blue format when on white or a very light color background. A Soft White logo may be used on a medium to dark colored background. A black logo can be used in a black and white only setting.
  • Maintain the visual integrity of the Anchore logo by avoiding these and any other modifications. anchore 0 Don’t change color or grayscale the logo
  • anchore Don’t skew the logo anchore 0 Don’t make the logo transparent a Developers 0 Don’t combine the logo mark with other words or symbols
  • anchore 0 Don’t change the font weight or add an outline to the logo
  • 0 Don’t add the logo over backgrounds where it won’t be legible
  • nC 0 Don’t crop or hide a portion of the logo
  • anchore 0 Don’t add shadows or effects to the logo anchore Don’t rotate the logo
Tone And Messaging
  • Anchore aims to use color intentionally to help communicate a message, a mood, and a meaning. Each brand color can be used at varying opacity, never less than 50%, and following an acceptable Color Combination.
  • Accent colors are used sparingly to create variation, focus attention, or differentiate items. They should not be used as background colors for paragraph text or for the text itself. Accents are used with varying opacity, never less than 50%.
  • Color must be appropriately applied to elements to ensure a minimum required contrast ratio and brand consistency. Below are acceptable color combinations for text and backgrounds. Only use these combinations for text when designing interfaces that require user comprehension.
  • Pure White should not be used for text on dark backgrounds.
  • Soft White text on dark backgrounds Use Soft White text on dark backgrounds.
  • Blue or accent colors for text 0 Don’t use blue or accent colors for text
  • Black for text headings Use Black for text on light backgrounds and gradients
  • Accent colors as text background €Don’t use accent colors as backgrounds for text.
  • Use gradient stops for text backgrounds
  • Don’t use accent colors over gradient backgrounds. Don’t use light text over gradients.
  • Use dark, light, or brand blue colors for visual elements over gradients. Use Black for text over gradients.
  • The relationship between fonts gives a brand its identity and its messages a voice. When used effectively, typography adds an essential dimension and distinctiveness to communications.
  • Anchore corporate design uses the Poppins font family as its primary typeface. Poppins Regular is used for body copy. Poppins Medium and Semibold are for headlines, subheads, and quotes.
  • Web typography is both responsive and adaptable to account for multi-device experiences. The Anchore brand embraces a disciplined hierarchy of typography to ensure the content is readable, accessible, and attractive on web and print.
  • Designing for a cross-media experience means typography needs to be both responsive and adaptable. In order to create an equally appealing experience on the web as in print, the Anchore brand embraces a disciplined hierarchy of typography by ensuring the content is readable, accessible, and attractive.
  • As an extention of Anchore’s brand, graphics should come across as disciplined and approachable. Avoid combining colors or elements in an overly dramatic or playful maner. Graphics should focus primarily on security, software supply chain, software containers, integration, and automation.
Visual Style
  • Anchore’s logo is the unique graphic symbol that distinguishes the brand from all others. Use of the logo, typography, and color should follow the guidelines within this document so that Anchore presents a consistent image to its various audiences.
  • The shorthand mark is a representation of what Anchore provides: stability in a fluid world. It uses the same elements as the standard logo—modularity, stability, and fluidity—but in an abbreviated format. The Anchore mark should only be used to complement the full logo and should not be used in any context where the full logo is not seen first.
  • To maintain the integrity of the Anchore identity, keep a fixed amount of open space around the entire logo to help it stand out. An appropriate clearspace for the logo is equal to half the height of the “a” (marked as x in the diagram)
  • For readability, do not scale the logo or shorthand mark below these minimum sizes. The standard logo should be no smaller than 72px wide. The shorthand mark should be no smaller than 12px wide.
Iconography
  • Icons are useful to illustrate concepts, provide visual interest, and differentiate items in a list. Anchore icons use simple line strokes to create two dimensional icons of objects and abstract patterns.
  • An icon’s container is a 32px square. Icons are displayed at either 32px or scaled uniformly to 20px. The grid guide provides a standard icon grid that is followed when creating new icons.
  • Primary and Accent shapes are 2.5px thick strokes. The strokes are always aligned to the pixel grid. Outer corners use a lpx radius.
  • 2.5px stroke, lpx radius Black or Soft White
  • 2.5px stroke, lpx radius Blue, Frost White, or Soft White
  • Container 32px (scaled 3x) Grid Guide
Layout And Composition
  • To maintain the integrity of the Anchore identity, keep a fixed amount of open space around the entire logo to help it stand out. An appropriate clearspace for the logo is equal to half the height of the “a” (marked as x in the diagram)
  • For readability, do not scale the logo or shorthand mark below these minimum sizes. The standard logo should be no smaller than 72px wide. The shorthand mark should be no smaller than 12px wide.
Photography Style
  • Anchore utilizes photography in design to support web based content such as biogs, case studies, web pages, etc. Images should be selected following these guidelines to create consistent, meaningful design.
  • Avatars are used to represent personas, users, or team members -either in their own likeness (e.g. Said Ziouani) or abstractly (e.g. DevOps Engineer).
  • Lifestyle photography portrays a person or people interacting with objects or others around them. It is Anchore’s primary photography style -as it can effectively communicate humanness, authenticity, and emotion in a digital world.
  • Still life photography is a useful secondary photo style, often used when illustrating general concepts such as containers, security, or automation.
  • While the perfect photo may not exist, these guidelines are meant to help in selecting strong photos. Follow these guidelines as closely as possible, but trust your own eye and intuition when weighing the strength of a photo. 1. Support the content
  • The primary purpose of an image in design is to support the content. Select photos that engage the user but don’t detract or distract from the content within a design. Maintain a consistent theme between the copy, graphics, and images on a page.
  • Focus and harmony apply to photos both in their concept and visually. “What is this photo about?” is easily answered in a well focused image. A harmonious image has visual consistency and directs a user to a single point within the image.
  • Use photos of the real, physical world. If you are unsure, ask yourself if the photo would require a design tools to create (e.g. Photoshop), or if you could recreate the photo with just a camera.
  • Photos should be well lit, in focus, and high quality. Avoid using images with pixelation, visual distortion, or artificial lighting (e.g. colored lights).
  • Avatar photos are people with a casual to happy expression in casual to semi-formal attire. Look for photos with good contrast between the subject and the background to make background removal easier.
  • Avatars representing personas or users should have their background removed and transparent. Stickermule provides a free tool to remove an image background.
  • After the background is removed, the image should be placed on one of Anchore’s accent or gradient colors. Avatars are typically displayed as round images, but should also be composed to work in a square format.
  • Lifestyle photography captures an individual or group interacting with their environment. These photos are most effective at engaging a viewer with the content the image supports.
  • Photos of humans should retain a human touch. Emotion is one of the most powerful tools in photography. Try to find images that capture an emotion the audience can connect with and that supports the content. Avoid photos that only show a hand or arm or people facing away from the camera.
  • Avoid staged or overly dramatic photos. While in reality many photos are staged, aim for photos that capture people interacting and positioned in a natural way, in realistic environments.
  • Use photos that include a diverse audience. Especially when working to create a collection of photos (e.g. biogs) ensure that a selected photo complements and continues to diversify the collection.
  • Still life photographs are a great way to communicate digital concepts such as containers, security, or automation using objects or scenes from the physical world.
  • Photos should be of the real world, without added objects or graphics. Edits are acceptable, but should always enhance -the best edits are not noticeable.
  • The photo should have a single focal point or subject. In general stay away from repeating patterns, solid surfaces, or abstract spaces. Keep in mind that the subject of a photo does not have to be one-to-one with a title or headline.
🐛 Report