Skip to content
PantoneTools
green
Tailwind CSS palette

Lime 300

lime-300 · #BEF264

HEX

#BEF264

RGB

rgb(190, 242, 100)

CMYK

cmyk(21%, 0%, 59%, 5%)

HSL

hsl(82, 85%, 67%)

LAB

lab(89.6, -37.6, 61.7)

What is Lime 300?

Lime 300 is the lime-300 reference in the Tailwind CSS palette. Its sRGB value is #BEF264 (rgb 190, 242, 100). It sits in the green family. The default color palette shipped with Tailwind CSS v3 by Tailwind Labs. 22 color families across 11 lightness steps (50 to 950). See disclaimer for accuracy and trademark notes.

Accessibility

WCAG 2.1 contrast checks for Lime 300 as a background.

Black text on this color

Sample text · 16.07 : 1
AA Normal
AA Large
AAA Normal
AAA Large

White text on this color

Sample text · 1.31 : 1
AA Normal
AA Large
AAA Normal
AAA Large

Shades, tints & tonal scale of Lime 300

An 11-step tonal scale derived from Lime 300 (#BEF264). Click any swatch to copy its HEX. Use these as a starting point for design tokens, hover states, and disabled states in a design system.

Copied #FAFEF3

50

#FAFEF3

#FAFEF3

Copied #F5FDE6

100

#F5FDE6

#F5FDE6

Copied #EAFBCD

200

#EAFBCD

#EAFBCD

Copied #DFF9B2

300

#DFF9B2

#DFF9B2

Copied #CEF58B

400

#CEF58B

#CEF58B

Copied #BEF264

500

#BEF264

#BEF264

Copied #A2CE55

600

#A2CE55

#A2CE55

Copied #7C9D41

700

#7C9D41

#7C9D41

Copied #566D2D

800

#566D2D

#566D2D

Copied #303D19

900

#303D19

#303D19

Copied #171D0C

950

#171D0C

#171D0C

Lighter tints (mixed with white)

Copied #CAF48B

15%

#CAF48B

Copied #D4F6A8

30%

#D4F6A8

Copied #DEF8BF

45%

#DEF8BF

Copied #E8FAD3

60%

#E8FAD3

Copied #F1FCE5

75%

#F1FCE5

Darker shades (mixed with black)

Copied #B1E15D

15%

#B1E15D

Copied #A2CF54

30%

#A2CF54

Copied #91BA4B

45%

#91BA4B

Copied #7DA140

60%

#7DA140

Copied #648232

75%

#648232

Color harmonies for Lime 300

Classic color-theory harmonies derived from rotating the hue of Lime 300. Use these to build accent palettes, brand systems, and accessible UI color pairings.

Complementary

180° opposite — strongest contrast

Copied #BEF264

#BEF264

#BEF264

Copied #9863F2

#9863F2

#9863F2

Triadic

Three colors 120° apart

Copied #BEF264

#BEF264

#BEF264

Copied #63BEF2

#63BEF2

#63BEF2

Copied #F263BE

#F263BE

#F263BE

Analogous

Two neighbors ±30° on the wheel

Copied #F2DF63

#F2DF63

#F2DF63

Copied #BEF264

#BEF264

#BEF264

Copied #76F263

#76F263

#76F263

Split-complementary

Base + two colors flanking its complement

Copied #BEF264

#BEF264

#BEF264

Copied #6376F2

#6376F2

#6376F2

Copied #DF63F2

#DF63F2

#DF63F2

Tetradic

Two complementary pairs

Copied #BEF264

#BEF264

#BEF264

Copied #63F298

#63F298

#63F298

Copied #9863F2

#9863F2

#9863F2

Copied #F263BE

#F263BE

#F263BE

Square

Four colors evenly spaced 90° apart

Copied #BEF264

#BEF264

#BEF264

Copied #63F2DF

#63F2DF

#63F2DF

Copied #9863F2

#9863F2

#9863F2

Copied #F26376

#F26376

#F26376

Lime 300 in every color space

Full conversion of Lime 300 across the color spaces designers and developers actually use — including OKLCH (the perceptually-uniform space that powers Tailwind v4 and CSS Color Module Level 4) and HWB.

HEX

#BEF264

RGB

rgb(190, 242, 100)

CMYK

cmyk(21%, 0%, 59%, 5%)

HSL

hsl(82, 85%, 67%)

HSV

hsv(82, 59%, 95%)

HWB

hwb(82 39% 5%)

CIE Lab

lab(89.6 -37.6 61.7)

OKLCH

oklch(89.7% 0.179 126.7)

XYZ (D65)

xyz(55.29, 75.37, 23.69)

Copy-ready code for Lime 300

Drop-in snippets for CSS, Tailwind, Sass, iOS Swift, and Android XML. Click the copy button on any snippet to put it on your clipboard.

CSS

color: #BEF264;
background-color: #BEF264;

CSS variable

:root {
  --color-lime-300: #BEF264;
}

Tailwind config

// tailwind.config.js
colors: {
  'lime-300': '#BEF264',
}

Sass

$color-lime-300: #BEF264;

Swift UIColor

UIColor(red: 0.745, green: 0.949, blue: 0.392, alpha: 1.0)

Android XML

<color name="lime-300">#BEF264</color>

Closest match in every color system

The nearest Lime 300 equivalent in every other color system on this site, ranked by ΔE2000 perceptual distance. Useful when translating between design-system, web-standard, and industrial color references.

Closest in Tailwind CSS palette

Top 6 ΔE2000-closest entries within the same collection.

Top 6 ΔE2000-closest Pantone references. Cross-system matching is approximate — see disclaimer.

Top 6 ΔE2000-closest RAL Classic references for industrial coating cross-reference.

Copied #EDFF21

RAL 1016

#EDFF21

Sulfur yellow

Copied #F8F32B

RAL 1018

#F8F32B

Zinc yellow

Copied #BDECB6

RAL 6019

#BDECB6

Pastel green

Copied #FFFF00

RAL 1026

#FFFF00

Luminous yellow

Copied #E1CC4F

RAL 1014

#E1CC4F

Ivory

Copied #E6D690

RAL 1015

#E6D690

Light ivory

FAQ about Lime 300

What is the HEX code for Lime 300?

Lime 300 (lime-300) has the HEX code #BEF264. In RGB it is rgb(190, 242, 100), and in CMYK it is cmyk(21%, 0%, 59%, 5%).

What is the OKLCH value of Lime 300?

Lime 300 converts to oklch(0.897 0.179 126.7). OKLCH is the perceptually uniform color space used by Tailwind v4 and CSS Color Module Level 4.

Is Lime 300 accessible for body text?

Used as a background, Lime 300 has a contrast ratio of 16.07:1 with black text and 1.31:1 with white text. WCAG 2.1 AA requires 4.5:1 for normal text. The current recommendation is to use black text and verify in real UI context.

What is the closest Pantone to Lime 300?

The closest Pantone reference to Lime 300 by ΔE2000 perceptual distance is Pantone 367 C (#A4D65E). Cross-system Pantone matching is approximate; for color-critical print work, verify with a physical Pantone guide.

What is the closest RAL color to Lime 300?

The closest RAL Classic reference to Lime 300 by ΔE2000 distance is RAL 1016 (Sulfur yellow, #EDFF21). RAL is a German industrial coating standard commonly used for paint, powder coat, and architectural specification.

What is the complementary color of Lime 300?

The complementary color (180° opposite on the HSL color wheel) of Lime 300 is #9863F2. Use it for high-contrast accents, error states, or call-to-action pairings.

Data provenance & source

Tailwind CSS default palette (v3)

The default color palette shipped with Tailwind CSS v3 by Tailwind Labs Inc. Use as a reference for design tokens, web color systems, and Tailwind-based design conversations. Names like 'blue-500' are the project's own naming convention.

Source type
derived
Confidence
high
License
MIT
Last reviewed
2026-05-24

Workflow tags

tailwind
design-token
web-system
green

Tailwind palette values are designed for digital interfaces under sRGB. For print, convert to a process-appropriate value and proof against the substrate; do not rely on sRGB CMYK conversion for color-critical print work.

Tailwind CSS palette · Lime 300 — #BEF264 | PantoneTools