Huehive Logo

HueHive

Css Ui Spectrum

Primary Blue #007BFF
Secondary Green #28A745
Warning Yellow #FFC107
Danger Red #DC3545
Info Cyan #17A2B8
Light Grey #F8F9FA
Dark Grey #343A40
Accent Purple #6F42C1
Muted Brown #A52A2A
Success Green #28A745
Text Black #212529
Background White #FFFFFF
#007BFF Primary Blue
#28A745 Secondary Green
#FFC107 Warning Yellow
#DC3545 Danger Red
#17A2B8 Info Cyan
#F8F9FA Light Grey
#343A40 Dark Grey
#6F42C1 Accent Purple
#A52A2A Muted Brown
#28A745 Success Green
#212529 Text Black
#FFFFFF Background White

CSS UI Spectrum

About This Color Palette

Here is a larger color palette designed for a CSS UI, incorporating a variety of colors that can be used for backgrounds, buttons, text, and accents:

json
{
  "palette_name": "CSS UI Spectrum",
  "colors": [
    {
      "name": "Primary Blue",
      "hex_code": "
                            
                            #007BFF
                        "
    },
    {
      "name": "Secondary Green",
      "hex_code": "
                            
                            #28A745
                        "
    },
    {
      "name": "Warning Yellow",
      "hex_code": "
                            
                            #FFC107
                        "
    },
    {
      "name": "Danger Red",
      "hex_code": "
                            
                            #DC3545
                        "
    },
    {
      "name": "Info Cyan",
      "hex_code": "
                            
                            #17A2B8
                        "
    },
    {
      "name": "Light Grey",
      "hex_code": "
                            
                            #F8F9FA
                        "
    },
    {
      "name": "Dark Grey",
      "hex_code": "
                            
                            #343A40
                        "
    },
    {
      "name": "Accent Purple",
      "hex_code": "
                            
                            #6F42C1
                        "
    },
    {
      "name": "Muted Brown",
      "hex_code": "
                            
                            #A52A2A
                        "
    },
    {
      "name": "Success Green",
      "hex_code": "
                            
                            #28A745
                        "
    },
    {
      "name": "Text Black",
      "hex_code": "
                            
                            #212529
                        "
    },
    {
      "name": "Background White",
      "hex_code": "
                            
                            #FFFFFF
                        "
    }
  ]
}

This palette includes a mix of colors suitable for various UI elements, ensuring good contrast and a professional look for your CSS designs.

Would you like to see examples of how to use these colors in a CSS stylesheet or any specific UI components?

What would you like to do?

Other Similar Palettes

#2C3E50
#F7F7F7
#FF6B6B
#50B8A1
#7D7F7D
#2C3E50
#F7F7F7
#FF6B6B
#50B8A1
#7D7F7D
#3F51B5
#FF2B2B
#FFC107
#1A1A1A
#007BFF
#00A3E0
#33B5E5
#4B0082
#6A0DAD
#FF4500
#FF6347
#FFA500
#FFC107
#FFFFFF

Update Your Palette

Current Palette

Primary Blue
Secondary Green
Warning Yellow
Danger Red
Info Cyan
Light Grey
Dark Grey
Accent Purple
Muted Brown
Success Green
Text Black
Background White

CSS UI Spectrum

Try these examples: