Huehive Logo

HueHive

Material Ui 2 Secondary Color Variants

Secondary Main #797778
Secondary Light #A6A6A6
Secondary Dark #4D4D4D
#797778 Secondary Main
#A6A6A6 Secondary Light
#4D4D4D Secondary Dark

Material UI 2 Secondary Color Variants

About This Color Palette

Based on the secondary main color #797778 that you’ve provided for a dark mode palette, I will generate suitable light and dark variants for your Material UI 2 palette.

Generated Colors:

  • Secondary Light: A lighter shade that complements the secondary main while providing a softer contrast.
  • Secondary Dark: A darker shade that enhances depth and visibility against a dark background.

Here’s the color palette in JSON format:

json
{
  "palette_name": "Material UI 2 Secondary Color Variants",
  "colors": [
    {
      "name": "Secondary Main",
      "hex_code": "
                            
                            #797778
                        "
    },
    {
      "name": "Secondary Light",
      "hex_code": "
                            
                            #A6A6A6
                        "
    },
    {
      "name": "Secondary Dark",
      "hex_code": "
                            
                            #4D4D4D
                        "
    }
  ]
}

Palette Description:

  • Secondary Main: #797778 is a muted gray-brown that serves as a versatile secondary color.
  • Secondary Light: #A6A6A6 is a lighter variant that adds brightness and can be used for hover effects or highlights.
  • Secondary Dark: #4D4D4D is a darker shade that provides strong contrast, ideal for emphasis in a dark theme.

Would you like any further adjustments or additional colors for your palette?

What would you like to do?

Other Similar Palettes

#4A90A4
#E8D5A5
#6EBD95
#FF7E6D
#FFD166
#70C3E8
#F7F5F2
#B0BEC5
#E0F7FA
#62757F
#000000
#D7D9D9
#F0F0F0
#8A8B8C
#000000
#FF80AB
#000000
#121212
#1E1E1E
#EF5350
#FFCDD2
#D32F2F
#FFFFFF
#4CAF50
#81C784
#388E3C
#FFFFFF
#FFEB3B
#FFF176
#FBC02D
#000000
#42A5F5
#90CAF9
#1976D2
#FFFFFF
#FFFFFF
#B0BEC5
#7B7B7B
#000000
#FFFFFF
#B0BEC5
#E0F7FA
#62757F
#000000
#D7D9D9
#F0F0F0
#8A8B8C
#000000
#FF80AB
#000000
#121212
#1E1E1E
#EF5350
#FFCDD2
#D32F2F
#FFFFFF
#4CAF50
#81C784
#388E3C
#FFFFFF
#FFEB3B
#FFF176
#FBC02D
#000000
#42A5F5
#90CAF9
#1976D2
#FFFFFF
#FFFFFF
#B0BEC5
#7B7B7B
#000000
#FFFFFF
#828fb0
#A6B7D9
#4F5D7F
#0052CC
#FFC107
#00C853
#F9FAFB

Update Your Palette

Current Palette

Secondary Main
Secondary Light
Secondary Dark

Material UI 2 Secondary Color Variants

Try these examples: