diff --git a/artwork-guidelines/project-logo-guidelines.md b/artwork-guidelines/project-logo-guidelines.md new file mode 100644 index 0000000..b0923e7 --- /dev/null +++ b/artwork-guidelines/project-logo-guidelines.md @@ -0,0 +1,60 @@ +# Logo Requirements for new Projects + +## Preamble + +The key words **MUST**, **MUST NOT**, **SHOULD**, **SHOULD NOT**, **RECOMMENDED** and **MAY** in this document are to be interpreted as described in [RFC 2119](https://www.rfc-editor.org/rfc/rfc2119.html) and [RFC 8174](https://www.rfc-editor.org/rfc/rfc8174.html). + +## Introduction + +As a foundation, we bring together a diverse range of projects, each with its own mission, voice, and identity. Our visual ecosystem is therefore designed to support individuality within a shared framework, rather than enforcing a single, uniform look. + +For this reason, there are no fixed color requirements for logos that become part of the foundation. We strongly encourage each project to retain its own visual personality. If your project is closely connected to, or builds upon an already existing project or logo within the foundation, you are welcome to align with a similar color scheme – this is optional, not a requirement. + +Beyond this, we ask all logos to follow general, universally accepted logo design principles to ensure clarity, usability, and long-term consistency across digital and print applications: + +- **Simplicity**: Logos should be clear, reduced, and easily recognizable. +- **Scalability**: The logo must work at very small and very large sizes. +- **Versatility**: It should function in color, and black & white. +- **Legibility**: Typography and symbols must remain readable across contexts. +- **Reproducibility**: The logo should work across digital, and print formats. +- **Timelessness**: Avoid trendy elements that may age quickly. + +## Variants + +**Multiple variants** of each logo **MUST** be created. +*Note: If a logo has a black color by design, then no colored variant is needed, i.e. this reduces the required RGB logo variants from 9 to 6.* + +*Greyscale variants are possible; black, white, and intermediate grey tones may be used. No color tones are permitted.* + +Check this reference to see all variants in action: [artwork/projects/armada at main · cncf/artwork](https://github.com/cncf/artwork/tree/main/projects/armada) + +| Name | Color | Description| +| -------- | ------- |------- | +|Horizontal|Color|Colored horizontal logo with project name as text. [Example](https://raw.githubusercontent.com/neonephos/artwork/refs/heads/main/projects/open-micro-frontend-platform/horizontal/color/open-micro-frontend-platform-horizontal-color.svg)| +|Horizontal|Black|[Example](https://raw.githubusercontent.com/neonephos/artwork/refs/heads/main/projects/open-micro-frontend-platform/horizontal/black/open-micro-frontend-platform-horizontal-black.svg)| +|Horizontal|White|[Example](https://raw.githubusercontent.com/neonephos/artwork/refs/heads/main/projects/open-micro-frontend-platform/horizontal/white/open-micro-frontend-platform-horizontal-white.svg)| +|Icon|Color|Colored icon without project name. [Example](https://raw.githubusercontent.com/neonephos/artwork/refs/heads/main/projects/open-micro-frontend-platform/icon/color/open-micro-frontend-platform-icon-color.svg)| +|Icon|Black|[Example](https://raw.githubusercontent.com/neonephos/artwork/refs/heads/main/projects/open-micro-frontend-platform/icon/black/open-micro-frontend-platform-icon-black.svg)| +|Icon|White|[Example](https://raw.githubusercontent.com/neonephos/artwork/refs/heads/main/projects/open-micro-frontend-platform/icon/white/open-micro-frontend-platform-icon-white.svg)| +|Stacked|Color|Colored icon with project name as text stacked below. [Example](https://raw.githubusercontent.com/neonephos/artwork/refs/heads/main/projects/open-micro-frontend-platform/stacked/color/open-micro-frontend-platform-stacked-color.svg)| +|Stacked|Black|[Example](https://raw.githubusercontent.com/neonephos/artwork/refs/heads/main/projects/open-micro-frontend-platform/stacked/black/open-micro-frontend-platform-stacked-black.svg)| +|Stacked|White|[Example](https://raw.githubusercontent.com/neonephos/artwork/refs/heads/main/projects/open-micro-frontend-platform/stacked/white/open-micro-frontend-platform-stacked-white.svg)| + +## Color Space + +Each logo variant **MUST** be provided in RGB color space. + +## Data Format + +Each logo variant **MUST** be provided in plain SVG format. + +These are the requirements for logo files: + +- Logo Design in SVG +- Artboard: 1:1 (for icon) +- Placement: Horizontally and vertically centered +- Color Space: RGB +- Fonts: Converted to outlines and embedded +- Strokes: Converted to fills (no brushes) +- No masks / hidden paths +- Export as SVG in SVG 1.1-profile