How to change rainbow to 'day mode'?

[tushev]

Hi,

First of all, thank you for your wonderful project!

I've set up rainbow theme with custom JSON. For night theme, it looks great. But the 'day' theme looks like this:

My code now looks like

{
  "type": "rainbow",
  "fileName": "3d-contrib-profile-day.svg",
  "backgroundColor": "#ffffff",
  "foregroundColor": "#00000f",
  "strongColor": "rgb(255,200,55)",
  "weakColor": "#aaaaaa",
  "radarColor": "#40bcd8",
  "growingAnimation": true,
  "saturation": "80%",
  "contribLightness": [
      "50%",
      "40%",
      "35%",
      "30%",
      "20%"
  ],
  "duration": "5s",
  "hueRatio": 7
}

(tried to play with hueRatio, saturation and contribLightness, but without any effect.

Is it possible somehow to make the isometric timeline look 'more appropriate' for day mode (a bit lighter/brighter)?

[tushev]

Hi again,

I figured it myself, sorry for inconvenience :)

    {
        "type": "rainbow",
        "fileName": "3d-contrib-profile-day.svg",
        "backgroundColor": "#ffffff",
        "foregroundColor": "#00000f",
        "strongColor": "#40bcd8",
        "weakColor": "#aaaaaa",
        "radarColor": "#40bcd8",
        "growingAnimation": true,
        "saturation": "25%",
        "contribLightness": [
            "90%",
            "80%",
            "70%",
            "60%",
            "50%"
        ],
        "duration": "7s",
        "hueRatio": -2
    },

Could you please explain what does hueRatio mean?

[yoshi389111]

Hello, tushev.

Thanks for looking at my repository.

In the HLS color space, three values are used: hue, saturation, and luminance. "hueRatio" indicates the amount of hue change (degrees) for each week. If hueRatio is 7 or -7, it will change 360 degrees in 360 days. For example, if hueRatio is 14, it will change 360 degrees in 180 days. In other words, the color changes twice in about a year.

The sign changes the direction of the color change.

hueRatio = -7

hueRatio = -14

hueRatio = 7

[tushev]

Got it! Thank you very much!