E-commerce & Payments
Square Color Codes
Square works in black and white, with a plain square as its mark. The Square color codes in Hex, RGB and CMYK can be found below. Jack Dorsey and Jim McKelvey started the company in 2009 after McKelvey, a glass artist, lost a sale because he could not take a card; the parent was renamed Block in 2021. Its sibling under Block is Cash App.
Primary colors
What are Square Primary Colors?
Square's primary colors are black #000000, white #FFFFFF.
Square publishes no open hex sheet; black and white are measured from the current mark.
Square Black
| Hex | #000000 |
|---|---|
| RGB | 0, 0, 0 |
| HSL | hsl(0, 0%, 0%) |
| CMYK | 0%, 0%, 0%, 100%converted · approximate |
| Pantone | PMS 419 Cnearest match · not published by the brand |
Square White
| Hex | #FFFFFF |
|---|---|
| RGB | 255, 255, 255 |
| HSL | hsl(0, 0%, 100%) |
| CMYK | 0%, 0%, 0%, 0%converted · approximate |
| Pantone | PMS 656 Cnearest match · not published by the brand |
Square Hex Color Codes
Square hex color codes are #000000 for black and #FFFFFF for white.
| Color | Hex |
|---|---|
| Black | #000000 |
| White | #FFFFFF |
Square RGB Color Codes
Square RGB color codes are 0, 0, 0 for black and 255, 255, 255 for white. Reach for RGB when a tool wants channel numbers or a CSS alpha value.
| Color | RGB |
|---|---|
| Black | rgb(0, 0, 0) |
| White | rgb(255, 255, 255) |
Square HSL Color Codes
Square HSL color codes are 0, 0%, 0% for black and 0, 0%, 100% for white. Change the third value for a lighter or darker version without moving the hue.
| Color | HSL |
|---|---|
| Black | hsl(0, 0%, 0%) |
| White | hsl(0, 0%, 100%) |
Square CMYK Color Code
Square CMYK color codes are conversions from the hex, because the brand publishes none. Check a printed proof before a full run.
| Color | CMYK |
|---|---|
| Black | 0%, 0%, 0%, 100% |
| White | 0%, 0%, 0%, 0% |
Square Pantone Color Codes
Square Pantone color codes are nearest matches by color distance, not brand specs. The table shows the closest swatch for every color.
| Color | Nearest Pantone |
|---|---|
| Black | PMS 419 C |
| White | PMS 656 C |
Logo
Square Logo Colors
Square logo colors are black and white: a solid square, name set below.
Square Logo Colors Palette
What the Square Logo Colors Mean?
The Square logo colors are as literal as the name. The mark is a square, drawn first as a small green cube to echo the white card reader that plugs into a phone, then flattened to a black-and-white shape as the company grew past that one product. There is no color symbolism left in it.
Square Logo Color History
Square logo color history moves from the 2009 green cube to a cleaner black square around 2016, set with a custom sans underneath. Black and white have carried it since.
Square Logo Fonts
Square logo fonts are Square Sans, part of the Cash Sans family drawn in-house, not licensed. A neutral grotesque such as Helvetica is the everyday stand-in.
Square Logo JPG
Square logo in JPG. No transparency, so it is flattened onto white. Safe for documents and slide decks.
Square Logo PNG
Square logo in PNG, with a transparent background. Use it over a colored surface.
Square Logo WebP
Square logo in WebP. Same transparency as the PNG at about a third of the file size.
Square Color Code Shades
Square color code shades step evenly from the primary toward black, for hover states, borders and shadows.
These are interface steps, not Square paint or trim names.
In code
Using the Square palette
CSS custom properties
:root {
--square-black: #000000;
--square-white: #FFFFFF;
}
Contrast against white
| Black | 21.00:1AA ✓ |
|---|---|
| White | 1.00:1AA × |
Brand colors are chosen for recognition, not for legibility. A failing value here is normal. It means use it as a fill, not as text.