Turquoise is named after the gemstone, which reached Europe through Turkey — turquoise is French for Turkish. The CSS keyword turquoise is #40E0D0, a bright blue-green at 174° hue. Copy the HEX codes from any scheme below, or generate a harmonious turquoise palette anchored to your own base colour.
Bright Turquoise runs from a near-black #003B36 to a pale #94E8E0. Ocean Turquoise is the bluest, reaching 197° at #05668D, and it includes the CSS keyword itself at #40E0D0. Soft Turquoise is the tint set, everything at 38% lightness or above.
#003B36#006466#0A9396#30D5C8#94E8E0#05668D#028090#00A896#40E0D0#B8F2E6#CFF5F0#A0EDE3#5FD9CC#30D5C8#1AA79CAnchored to a turquoise base — press Space or Generate to roll more schemes. Click a swatch to copy its HEX, lock one to keep it while the rest re-roll, then export as CSS, JSON or HEX.
Drag in the colour area or the hue bar, or type a HEX / RGB value, then build a scheme anchored to it.
Turquoise is a mid-tone, so it needs a dark partner for structure — a deep teal or navy — and a warm neutral to stop it looking clinical. Coral and sand are the classic tropical pairings. Aqua is its close neighbour and mint green the softer, greener one. Travel, swimwear, wellness and children’s brands use it.
:root block with each colour as a custom property (--color-1, --color-2 and so on), or copy a single HEX straight from any swatch above. On a narrow phone the generator shows four swatches instead of five, so the block you copy there carries four custom properties. Whatever the width, it rolls around #30D5C8, the turquoise this page is seeded with, so the export stays on-hue. Copy JSON and Copy HEX give the same values as an array and as a comma-separated line.More palettes: Aqua palette · Mint Green palette · Teal palette · all colours