Adding opacity to hex colors

We usually use rgba to add opacity to colors.
But recently I was working on a project which all the colors were defined in a theme object with in hex format.
like this:

export type ThemeItem = {
  loader:string;
}

 const darkTheme = {
  loader: "#ffffff",
};

 const lightTheme = {
  loader: "#000000",
};

After a short talk with designer I figured out that every color in the theme object can have different opacity like 10% or 20% ...

For adding this functionality to our design system I added this function according to this stack overflow answer:

export function addOpacityToColor(color: string, opacity: number) {
  const _opacity = Math.round(Math.min(Math.max(opacity || 1, 0), 1) * 255);
  return color + _opacity.toString(16).toUpperCase();
}

and we can use it this way:

addOpacityToColor(theme.green, 0.3)

Here you can read more about adding alpha value to css hex codes