--- title: "Phase | Brand" description: "Download the Phase logo: logomark and lockup as SVG, in black and white, with clear-space, sizing and usage guidelines." url: https://phase.dev/brand/ --- Brand # Logo & assets The Phase logomark and lockup, as SVG. These usage guidelines will help you use our brand identity when writing about or building with Phase. [Download all](https://phase.dev/assets/brand/phase-brand-assets.zip)ZIP · 6 SVG + 5 PNG + README · 220 KB AssetsSVG / Vector ## Logos. Both marks come in black and white. The files are cropped to the artwork with no built-in padding. ![Phase lockup, white](https://phase.dev/assets/brand/phase-lockup-white.svg) [SVG](https://phase.dev/assets/brand/phase-lockup-white.svg)[PNG](https://phase.dev/assets/brand/phase-lockup-white.png) ![Phase lockup, black](https://phase.dev/assets/brand/phase-lockup.svg) [SVG](https://phase.dev/assets/brand/phase-lockup.svg)[PNG](https://phase.dev/assets/brand/phase-lockup.png) B.01 ### Lockup Symbol and wordmark together. The default for most placements; switch to the logomark alone when space is tight. 1490.56 × 545.2 ![Phase logomark, white](https://phase.dev/assets/brand/phase-logomark-white.svg) [SVG](https://phase.dev/assets/brand/phase-logomark-white.svg)[PNG](https://phase.dev/assets/brand/phase-logomark-white.png) ![Phase logomark, black](https://phase.dev/assets/brand/phase-logomark.svg) [SVG](https://phase.dev/assets/brand/phase-logomark.svg)[PNG](https://phase.dev/assets/brand/phase-logomark.png) B.02 ### Logomark The symbol on its own. Built for avatars, favicons, app icons and anywhere the lockup would be too wide to stay legible. 368.561 × 545.2 ![Phase avatar tile](https://phase.dev/assets/brand/phase-avatar.png)![Phase avatar tile, circle crop](https://phase.dev/assets/brand/phase-avatar.png) B.03 ### Avatar The white logomark on Zinc 950, sized to survive circular crops. 1024 × 1024. [PNG](https://phase.dev/assets/brand/phase-avatar.png) GeometryClear space / Minimums ## Spacing and padding. Keep clear space of at least half the symbol's width on all four sides. Nothing else belongs inside it — no text, no rules, no other logos, no edge of the page. Both marks share the same height, so the same padding applies to either. Clear space0.5 × symbol width In render terms0.338 × mark height Rule of thumb⅓ of mark height In file units184.28 Minimum — symbol16 px tall Minimum — lockup20 px tall Clear spacePadding = 0.338 × mark height 20 px → 7 px 24 px → 9 px 32 px → 11 px 48 px → 17 px 64 px → 22 px 96 px → 33 px Minimum size — shown actual size ![Phase logomark at 16 pixels tall](https://phase.dev/assets/brand/phase-logomark-white.svg)16 px ![Phase lockup at 20 pixels tall](https://phase.dev/assets/brand/phase-lockup-white.svg)20 px UsageDo / Don't ## Usage. Black or white, nothing else. It has to hold up at 16 pixels in a browser tab and at three metres on a conference banner. Do - Use the black mark on light backgrounds and the white mark on dark ones. - Scale from the SVG — set one dimension and let the other follow. - Keep the clear space below free of text, rules and other logos. - Place the mark on a plain background, or a quiet area of a photograph. Don't - Recolor the mark, or fill it with a gradient. - Rotate, skew, stretch or condense it. - Add a drop shadow, glow, outline or bevel. - Redraw the wordmark in another typeface, or respace the lockup. - Put the mark inside a box, badge or circle of your own. - Use it in a way that implies a partnership or endorsement we have not agreed. Color & typeSupporting ## Typography and colors. These are the colors and typefaces we use on our own surfaces. Emerald 500 is the brand green; Emerald 400 is the lighter step we reach for on near-black backgrounds, where 500 loses contrast. Everything else is a zinc gray: 400 for body text, 500 for labels, 600 for annotations, 800 for hairlines. The logo itself takes none of these — it is only ever black or white. Interface Inter Headings and body copy, medium weight. Mono JetBrains Mono Labels, code and annotations. Contactinfo@phase.dev ## Naming. The product is **Phase** — capital P, no other styling. Not PHASE, not phase.dev in running text. The company behind it is Phi Security Inc. Boilerplate Phase is an open-source, end-to-end encrypted secrets management platform for teams and AI agents. It runs as a managed cloud service or self-hosted on any infrastructure, and is built by Phi Security Inc. Need something that isn't here — a different format, product screenshots or a review of how you're using the mark? Get in touch. [info@phase.dev](mailto:info@phase.dev)[Download all](https://phase.dev/assets/brand/phase-brand-assets.zip)[GitHub](https://github.com/phasehq) SVG + PNG · BLACK / WHITE · PHASE.DEV/BRAND