Aqua Color Code
Aqua·#00FFFF
Aqua is the classic CSS named aqua at #00FFFF and is effectively the same color value as Cyan. Use it when you need a legacy web reference, an explicit aqua label, or a bright cool accent for technical highlights and expressive UI moments.
Tonal Scale
Contrast Checks
White text on this color
Buttons, badges, and filled actions.
Dark text on this color
Large headings and selective UI.
This color on light surface
Links, borders, and icons on light UI.
Professional Reference
Accessibility Matrix
White text on this color
White text placed on the current color.
Dark text on this color
Dark text or headings on the current color.
This color on light surface
Use this color for links, strokes, or icons on light UI.
This color on dark surface
Use this color inside dark shells for strokes, tags, or icons.
Where It Works
- Legacy web reference, bright callouts, and aqua accents.
- Same hex as Cyan, but useful as a distinct naming target.
- Pairs with white, ink-dark neutrals, and deep blue anchors.
Reference Notes
Aqua is sourced from the published CSS Standard Colors library and retained here as a searchable reference swatch for product, interface, and branding work.
Clean cyan and teal hues for product UIs.
Related Colors
Palette Starting Points
Implementation Snippets
:root {
--color-aqua: #00FFFF;
--color-aqua-rgb: 0 255 255;
}class="bg-[#00FFFF] text-white"
class="hover:bg-[#00B8B8] ring-1 ring-[#00FFFF]"{
"aqua": "#00FFFF",
"aquaRgb": [0, 255, 255],
"aquaHsl": [180, 100, 50]
}