Simplest color scheme generator in Vuejs

I try to make the simplest color generator with JavaScript.
My understanding of the generator is that it works most of the time with HSL color representation. It is mostly for me to practice conversions between colors.

I first convert hex color to RGB color by taking input and take first 2 characters to represent Red value than next 2 characters represent Green value and last 2 character is Blue value. After that, I take RGB color and convert it to HSL I found Here. In the end, I just take the HSL value and change the L(lightness) value if I want darker color I subtract some value and if I want lighter color I add some value.
You can check how it looks like and plays a little with it on my codepen.
In the next few days, I will try to recreate Adobe color.