Skip to content
LogoHub
Dev & Toolsprettier-icon-lightDark Variant

Prettier

Official Prettier (prettier-icon-light) vector logo in the Dev & Tools category. Download lossless SVG and a 1024px transparent PNG.

Prettier Logo
Dedicated official dark-mode SVG variant available

Brand Color Palette

Click swatch to copy HEX

Download

Download SVG Vector FilePNG
Download all as ZIP
ADChatGPT Plus·Official Shared & Dedicated Plans · Instant Access to GPT-6.1 Sol / Deep Research
Code 6666888 · 5% OFF
ADNetflix 4K·Dedicated Profile · Private PIN Lock · All Devices Supported
Code 6666888 · 5% OFF
Vector Format
SVG · 1:1
Raster Export
1024 × 1024 px
SVG viewBox
0 0 210 210
File Size / Nodes
3.0 KB · 41 paths
Official Site
https://prettier.io/

Edit & Export

Recolor, add a background or padding, then export. Everything runs locally in your browser.

Colors

Background

Format
Size

SVG, PNG 16–2048px, JPG, WebP, ICO and a favicon setPrettier.zip

Brand Visual Specifications & SVG Parameters

Database-extracted geometry, color models & WCAG contrast metrics

Brand Entity / Display Name
Prettier (prettier-icon-light)
Industry Category
Dev & Tools
Primary Color (HEX / RGB / HSL)
#CFD4D7rgb(207, 212, 215) · hsl(202, 9%, 83%)
WCAG Surface Contrast
Light 1.5:1 · Dark 13.3:1

Inline SVG Code Snippet

<svg xmlns="http://www.w3.org/2000/svg" width="210" height="210" viewBox="0 0 210 210"><g fill="none" fill-rule="evenodd"><g transform="translate(0 200)"><rect width="60" height="10" x="150" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="70" height="10" x="70" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="60" height="10" fill="#EA5E5E" rx="5"/></g><g transform="translate(0 180)"><rect width="50" height="10" x="160" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="20" height="10" x="130" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="50" height="10" x="70" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="20" height="10" x="40" fill="#F7B93E" rx="5"/><rect width="30" height="10" fill="#56B3B4" rx="5"/></g><g transform="translate(0 160)"><rect width="100" height="10" x="110" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="30" height="10" x="70" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="60" height="10" fill="#BF85BF" rx="5"/></g><g transform="translate(0 140)"><rect width="30" height="10" x="180" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="30" height="10" x="140" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="100" height="10" x="30" fill="#F7B93E" rx="5"/><rect width="20" height="10" fill="#BF85BF" rx="5"/></g><g transform="translate(0 120)"><rect width="40" height="10" x="170" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="40" height="10" x="120" fill="#BF85BF" rx="5"/><rect width="50" height="10" x="60" fill="#EA5E5E" rx="5"/><rect width="50" height="10" fill="#56B3B4" rx="5"/></g><g transform="translate(0 100)"><rect width="30" height="10" x="180" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="90" height="10" x="80" fill="#56B3B4" rx="5"/><rect width="40" height="10" x="30" fill="#F7B93E" rx="5"/><rect width="20" height="10" fill="#EA5E5E" rx="5"/></g><g transform="translate(0 80)"><rect width="20" height="10" x="190" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="60" height="10" x="120" fill="#F7B93E" rx="5"/><rect width="40" height="10" x="70" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="60" height="10" fill="#BF85BF" rx="5"/></g><g transform="translate(0 60)"><rect width="20" height="10" x="190" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="60" height="10" x="120" fill="#EA5E5E" rx="5"/><rect width="40" height="10" x="70" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="20" height="10" x="40" fill="#56B3B4" rx="5"/><rect width="30" height="10" fill="#F7B93E" rx="5"/></g><g transform="translate(0 40)"><rect width="30" height="10" x="180" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="20" height="10" x="150" fill="#56B3B4" rx="5"/><rect width="50" height="10" x="90" fill="#BF85BF" rx="5"/><rect width="80" height="10" fill="#56B3B4" rx="5"/></g><g transform="translate(0 20)"><rect width="40" height="10" x="170" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="110" height="10" x="50" fill="#F7B93E" rx="5"/><rect width="40" height="10" fill="#EA5E5E" rx="5"/></g><rect width="70" height="10" x="140" fill="#CFD4D7" opacity=".5" rx="5"/><rect width="130" height="10" fill="#56B3B4" rx="5"/></g></svg>

Engineering & Layout Guidelines

  • Maintain the native 1:1 aspect ratio (viewBox "0 0 210 210") without non-uniform stretching.
  • Preserve at least 20% clear space around the emblem bounding box.
  • Solid vector paths; supports direct inline <svg> embedding or <img> rendering.

Related Brand Logos

View All in Category
Action completed