breadcrumb
Energy Yellow
| How Energy Yellow is Used | 
| affect moodawake awarenessenergizerelaxsimulate | 
| Industries that Commonly Use Energy Yellow | 
| foodleisuresportstransportationtravel | 
Color Code Details
| HEX | #f5e653 | |
| RGB | (245, 230, 83); | |
| RGBA | (245, 230, 83, 1) | |
| HSL | (54, 89%, 64%); | |
| HSLA | (54, 89%, 64%, 1); | 
| HSV | 54,66,96 | |
| HSB | 54, 66, 96 | |
| HWB | 54 33% 4% | |
| CMYK | 0, 6, 66, 4 | |
| Pantone | Yellow C | 
Preview & Codes Examples
| Text Color with Energy Yellow | |
| This Text has a Font Color of #f5e653 | |
| 
										
											.text {color:#f5e653;}										
									 | |
| 
										
										.text {color:rgba(245, 230, 83, 1);}										
									 | |
| 
										
										.text {color:hsl(309, 100%, 3%);}										
									 | 
| Background Color Using Energy Yellow | |
| This element has a background color of #f5e653 | |
| 
										
											.element {background-color:#f5e653;}										
									 | |
| 
										
										.element {background-color:rgba(245, 230, 83, 1);}										
									 | |
| 
										
										.element {background-color:hsl(309, 100%, 3%);}										
									 | 
| Border Styling with Energy Yellow | |
| This element has a border color of #f5e653 | |
| 
										
											.element {border:1px solid #f5e653;}										
									 | |
| 
										
										.element {border:1px solid rgba(245, 230, 83, 1);}										
									 | |
| 
										
										.element {border:1px solid hsl(309, 100%, 3%);}										
									 | 
Preview & Variables
| CSS Variables | |
| 
										
											--variable: #f5e653;										
									 | 
| Sass / SCSS | |
| 
										
										$variable: #f5e653;										
									 | 
| Less | |
| 
										
											@variable: #f5e653;										
									 | 
Similar Yellow Shades You Might Like
Yellow radiates energy, optimism, and clarity. Ideal for lifestyle brands, education apps, and food-related UI. Check out more bright and cheerful yellow tones below.