Logo for a light background
Section reviewAwaiting review4 met · 0 to improve · 4 to review
What is in place, what needs improving, and what still needs a closer look. Each status refers only to the criterion below; it is not approval of the whole section.
- Meets criterionOfficial logos are available for light and dark backgrounds.
All three full-logo treatments, three icon tiles and the standalone symbol have SVG, PNG and lossless WebP downloads, with direct URLs in brand.json. Full logos and the standalone symbol preserve transparency.
View supporting material ↗ - Awaiting reviewThe logo expresses the business and makes sense to its audience.
Review the mark with the brand owner against the positioning and intended audience.
- Awaiting reviewThe mark is recognizable without unnecessary detail.
Compare silhouette and monochrome applications; identify details that obscure recognition.
- Awaiting reviewThe logo stays legible at its smallest intended size.
Pilot sizing is documented: 96 CSS px digitally and 20 mm in print. Review the small-size applications with the brand owner and proof print at final size.
- Awaiting reviewLettering and color support the same brand personality.
Review complete logo applications, including one-color use, without relying on color alone.
- Meets criterionClear space and proportional sizing have a reproducible specification.
The guide uses half the exported logo height on every side, with diagrams, digital previews and structured measurements.
Read logo specifications ↗ - Meets criterionThe existing brand icon has reusable files and usage guidance.
Original favicon preserved; vector colon assets, crop previews, clear space and 16–128 px examples are documented. Brand approval and physical print proof remain pending.
View brand icon ↗ - Meets criterionApplication rules include visual examples and AI-readable guidance.
Layout guides, image contrast comparisons, physical placement diagrams and six misuse examples are documented. Production-specific applications still need validation.
View application guide ↗
01 / Brand
Recognizable in every detail.
Use the existing brand files and preserve their proportions. The logo’s color belongs to the asset; it does not change automatically with the interface palette.
Download the original SVG or a transparent PNG or lossless WebP. Open a file or copy its direct URL to share with your team or AI.
Logo for a dark background
Logo for a lime background · white colon
Keep the brand intact.
Use the light-background file on light surfaces and the dark-background version wherever it remains legible. Do not stretch, crop, add effects or replace the lettering with a similar font.
Brand icon
Two dots. One signature.
The offset colon already represents 6am in our favicon. It is our compact signature when the full name will not fit and people already know whose space they are in.
One symbol. Every shape.
Start with the square file. The circle and rounded corners below preview crops applied by apps and social platforms; the symbol itself stays the same. Its original green is #C4E86B. On a lime background, both dots are white.
Original green on black
Black on white
White on lime
Give it room to be recognized.
H is the full height of both dots. Leave at least ¼H on every side of the standalone symbol. In the square files, the symbol is half the canvas height; the built-in margin also protects it inside a circular crop.
Small, but still unmistakable.
These examples appear at the labeled CSS pixel size. Use the vector file to export the resolution your platform requests. The proposed minimum for the square favicon is 16 px; a standalone symbol needs at least 16 px of height, plus its clear space.
At 16 px, check that both bars remain distinct on the target screen. Prefer 32 px or larger when space allows. Print sizes still need a physical proof.
Where it belongs.
- Use it for favicons, avatars and app shortcuts where the brand is already identified by context.
- Use the full logo in presentations, proposals and first introductions. Keep the name wherever people need to read it.
- Preserve both bars, their offset and their proportions. Do not rotate them, align them vertically or rebuild them with a font character.
- Upload the square file to platforms that apply their own crop. Do not export rounded corners on transparency before a second crop.
- In interfaces, provide the accessible name “6am”. This symbol identifies the brand; it is not an action icon.
Standalone symbol
Pilot documentation: the symbol comes from the existing favicon and the colon in the logo. These vector applications, margins and sizes await brand review; the website still uses its current favicon.
Give the logo room to be recognized.
Clear space protects the mark from nearby text, images and edges. Scale the complete logo proportionally, using the original SVG files.
Clear space
Let H be the height of the exported logo. Keep at least ½ H clear on all four sides. Measure from the logo frame, not from the outside of a padded image container.
A quiet background can continue through the clear space. Text, icons, borders, other logos and busy image details must stay outside it. Page edges must also respect this distance.
Small enough to fit. Large enough to read.
These are starting specifications for this pilot. Use a larger logo when distance, contrast, reproduction or screen conditions make it harder to recognize. Minimum size refers to the logo itself, excluding clear space.
Digital minimum
96 CSS px wide, about 19.2 px high. Keep about 9.6 px clear on each side. At 100% browser zoom, the example below is rendered at 96 CSS px.
Print minimum
20 mm wide, about 4 mm high, with 2 mm clear on each side. Proof at final size on the intended material before approval.
The screen example is enlarged for explanation; it is not a physical ruler. Print and digital minimums are independent specifications.
Check the digital size.
Move the slider and compare light and dark surfaces. The logo keeps its proportions and clear space as it changes size.
At or above the pilot minimum. Review readability in the final context.
- Logo height
- 28.8 px
- Clear space per side
- 14.4 px
- Total reserved width
- 172.8 px
Choose the position. Keep the space.
Use the top-left as the starting position on pages, documents and presentations, aligned to the content grid. Social pieces can use another corner when the template calls for it. Keep that position consistent across a series.
One clear message.
A useful idea, ready to share.
The distance from the logo to the edge must be at least the greater of the layout margin and ½ H. Clear space is a minimum, not a replacement for the page grid.
Placement diagrams only. Channel interface overlays and safe areas need their own allowance, in addition to the logo’s clear space.
One mark. Many places.
From a social post to a storefront, the brand should stay easy to recognize. Choose the right file, give it room and keep it readable in every format.
Let the message guide the placement.
Start at the top-left on pages and documents. For campaigns, a top-right or bottom-center signature can suit the composition. Align the logo with the content and keep its position consistent across the series.
Your next step starts here.
The signature starts the reading order. Align the headline to the same left margin.
A useful idea. Ready to share.
A centered composition calls for a signature on the same axis. Leave room between the headline and the logo.
Clarity for everyday work.
Balance a left-aligned headline with the signature on the right. Start the text below the logo band.
Guides show alignment; they are not part of the artwork. Allow for logo clear space as well as the margins and safe areas required by each channel.
On photos, find a quiet spot.
Choose an uncluttered area with enough contrast for both the lettering and the colon. If the photo cannot provide that space, change the crop or put the signature on a solid band. Do not add outlines or shadows to make the logo readable.
Do
Use a dark, uncluttered area.
Don’t
Avoid bright detail behind the signature.
Demonstrated with an existing 6am illustration. The same rule applies to photography; this is not a client photograph.
Different surroundings. The same signature.
Signs, vehicles and objects need a check at the real viewing distance and on the real material. These diagrams show placement and orientation; they are not fabrication files.
Use the full name on a continuous surface. Allow for edges, seams and fixings. Size it for the viewing distance; the print minimum is not a storefront specification.
Keep 6am readable from left to right on both sides. Mirror the vehicle drawing, never the logo. Keep the signature away from handles, wheels and panel breaks.
Keep the logo horizontal on signs and banners. If the name will not fit legibly, rearrange the layout or use the icon where context supports it. Do not stack letters or rotate the logo yourself.
Know what weakens the mark.
The examples below deliberately show mistakes. Use the catalog assets without these alterations when producing artwork.
Do not stretch it
Scale width and height together. A narrow container is no reason to distort the mark.
Do not rotate or mirror it
Keep the horizontal reading direction. Neither the side of a vehicle nor the format changes the orientation of the brand.
Do not invent colors
Choose a supplied variant. On lime, the 6 and am are black and the colon is white.
Do not add effects
Avoid outlines, shadows, glows and textures. Solve contrast by choosing the right background and file.
Do not crop the signature
Keep the full artwork and its clear space. For compact spaces, consult the brand icon section.
Design. Build. Grow.Do not crowd it
Keep text, lines and other marks out of the clear space. A subheading should not become part of the signature.
Before you hand it over.
- Check the full logo and colon at the final size, with the right variant for the background.
- Check margins, clear space, crops and interface overlays in every format.
- Use SVG for unrestricted scaling; export enough pixels for the intended size when using PNG or WebP.
- For print, confirm colors and finishes with the supplier and proof on the intended material. The catalog files are RGB.
- A new orientation, monochrome version or partner lockup needs to be defined as a separate asset before production.
Pilot guidance. Physical applications, finishes, vertical lockups and partner lockups still need development and validation. Mirroring or rebuilding the logo is not permitted.
Clarity comes first.
Write as if you were talking to the business owner. Every screen should make it clear what to do and what happens next.
Lime has a purpose.
Use the signature color to highlight actions and important moments. Black, white and graphite give everything else structure.
Consistency that evolves.
Reuse components and rules. A new need should improve the shared system, with an identifiable version.