← Back to All Colors
Tailwind Lime Color Palette
Fresh and vibrant, excellent for success states and eco-friendly themes.
Click any button to copy className, HEX, RGB, HSL, or OKLCH.
50
lime-50
#f7fee7
100
lime-100
#ecfccb
200
lime-200
#d9f99d
300
lime-300
#bef264
400
lime-400
#a3e635
500
lime-500
#84cc16
600
lime-600
#65a30d
700
lime-700
#4d7c0f
800
lime-800
#3f6212
900
lime-900
#365314
950
lime-950
#1a2e05
Quick Reference
| Shade | Class | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| lime-50 | #f7fee7 | rgb(247, 254, 231) | hsl(78, 92%, 95%) | oklch(0.986 0.031 120.757) | |
| lime-100 | #ecfccb | rgb(236, 252, 203) | hsl(80, 89%, 89%) | oklch(0.967 0.067 122.328) | |
| lime-200 | #d9f99d | rgb(217, 249, 157) | hsl(81, 88%, 80%) | oklch(0.938 0.127 124.321) | |
| lime-300 | #bef264 | rgb(190, 242, 100) | hsl(82, 85%, 67%) | oklch(0.897 0.196 126.665) | |
| lime-400 | #a3e635 | rgb(163, 230, 53) | hsl(83, 78%, 55%) | oklch(0.841 0.238 128.85) | |
| lime-500 | #84cc16 | rgb(132, 204, 22) | hsl(84, 81%, 44%) | oklch(0.768 0.233 130.85) | |
| lime-600 | #65a30d | rgb(101, 163, 13) | hsl(85, 85%, 35%) | oklch(0.648 0.2 131.684) | |
| lime-700 | #4d7c0f | rgb(77, 124, 15) | hsl(86, 78%, 27%) | oklch(0.532 0.157 131.589) | |
| lime-800 | #3f6212 | rgb(63, 98, 18) | hsl(86, 69%, 23%) | oklch(0.453 0.124 130.933) | |
| lime-900 | #365314 | rgb(54, 83, 20) | hsl(88, 61%, 20%) | oklch(0.405 0.101 131.063) | |
| lime-950 | #1a2e05 | rgb(26, 46, 5) | hsl(89, 80%, 10%) | oklch(0.274 0.072 132.109) |
Usage Examples
Background
bg-lime-500Text
text-lime-500Sample Text
Border
border-lime-300Ring
ring-lime-500Explore Other Colors
Explore more Tailwind tools
Tailwind Grid Generator
Create grid layouts visually
Tailwind Flexbox Generator
Create flex layouts visually
Tailwind Gradient Generator
Create custom gradients
Aa
Tailwind Text Gradient
Gradient text effects
Tailwind Gradients Collection
275+ ready-to-use gradients
Tailwind Colors
Complete 240+ color palette
Tailwind Box Shadow Generator
Design multi-layer shadows
Aa
Tailwind Text Shadow
Add depth to text with shadows
Tailwind Filter Generator
Apply blur, brightness & more
Tailwind Transform Generator
Rotate, scale & translate elements
Tailwind Animation Generator
Create built-in & custom animations
Tailwind Transition Generator
Smooth hover transitions
Tailwind Config Generator
Generate your config file
Tailwind Input Generator
Design form inputs visually
Tailwind Class Sorter
Organize classes in order
Flexbox Cheatsheet
All flex utilities visualized
Overflow Cheatsheet
Control content overflow