Color guide · Green colors

Mint Color

This mint anchor is a light green selected at #98FF98. It is brighter than many muted mint paints or fabrics. It can illuminate a small detail or provide a light panel, especially when paired with a dark green or charcoal.

A pale, bright green for fresh highlights#98FF98Custom library anchor · use the HEX code

Mint color codes

HEX#98FF98
RGBrgb(152, 255, 152)
HSLhsl(120, 100%, 79.8%)
Library anchor#98FF98

RGB values use the 0–255 scale. HSL values are rounded to one decimal place for display. CSS Color: named colors ↗

The name & the reference

What makes mint interesting?

Mint names cover several pale-green directions; this guide chooses one repeatable digital anchor without treating it as a universal standard. Plant leaves, confectionery and dyed fabric are different references. Choose the version that serves the project, then share the exact hex value with collaborators.

Read the reference: CSS Color: named colors ↗

Things with mint tones

These illustrated references explore a color family. Objects vary; none is a claim of an exact #98FF98 match.

Illustrated placeholder · image coming later

Leaf-inspired highlights

A pale highlight can lift a leaf illustration while deeper greens define the rest of it.

Illustrated placeholder · image coming later

Pastel painted objects

A light green mug or tile gives a useful surface reference.

Illustrated placeholder · image coming later

Pale green fabric

Fabric folds need darker companions so a bright mint base retains shape.

Ideas for using mint

01

Interfaces

Try mint behind a short note with dark text. Add an icon if the panel communicates success.

02

Games

Use mint as a small glow against forest green, keeping the brightest areas sparse.

03

Illustration

Pair mint with rose and an ivory base for a limited pastel direction, then check text independently.

Watch out: Mint with white usually lacks enough contrast for readable text or important outlines.

Tints, shades & companion hues

These tints and shades are simple sRGB channel mixes with white or black. They are useful starting points, not perceptually equal steps or guaranteed accessible pairs. Select a swatch to copy its hex code.

Hue companions

Calculated in HSL with the same saturation and lightness. Complementary and analogous colors suggest hue relationships; they do not promise contrast.

Palettes featuring mint

Garden Notes

Muted foliage with a bright mint detail

Explore palette →

See the palette at work

Palette preview studio

Compare two colors →

Try a website, a game scene, a poster or a room. Pick a role, then select a swatch to repaint it. These are schematic design previews, not rendered materials or a game engine.

Text is automatically chosen as black or white for opaque preview surfaces. This does not certify your exported palette for every use.

Color & craftStories · Studio
A thoughtful starting point

Make something worth exploring.

A clear reading surface, one useful accent and room for the details.

Explore the collection →
Design notesNew ideasSmall details

Try it in context

Live design & contrast preview

Change the surface and text independently. The text result uses opaque sRGB colors; it does not evaluate your entire page.

17.09:1 · AAA normal text

AA normal text needs 4.5:1; AA large text needs 3:1. Large text means at least 18 pt, or 14 pt bold. Ratios are assessed before rounding. This is a text check, not a complete accessibility audit. W3C: understanding text contrast ↗

A little color goes a long way

Your next good idea

Try a readable heading, a short paragraph and a clear action on this surface.

Example action →Static design sample · use the controls to change it

Compare mint with another color →

Questions about mint

Is this the CSS mintcream color?

No. Mintcream is a different standardized shade. This guide uses the custom mint anchor #98FF98.

Will this look the same in print?

No exact print match is promised. Paper, ink, color profiles and lighting affect the result. Use a physical proof when a precise material match matters.

Can I use these codes in a website or game?

Yes. Copy the exact code, give it a clear role in your palette and test text contrast. Add labels or shapes when color communicates important information.

Keep exploring

Explore green colors →

#228B22
Green colors

Forest Green

A medium green inspired by dense foliage

Explore color →
#FFFFF0
Light & dark neutrals

Ivory

A near-white with a small warm shift

Explore color →
#808000
Green colors

Olive

A restrained yellow-green with earthy weight

Explore color →

A color name is a starting point

Digital codes describe sRGB colors. Natural objects, paint, ink and screens can look different under different lighting or calibration. Visual references illustrate color families rather than exact measured matches. Placeholder illustrations are clearly labeled. Design ideas are suggestions, not universal claims about emotion or culture.

Pick colors from an image · Convert a color · Check a complete text pair · Suggest a color guide