getCssVariable.js

/**
 *
 * @param {string} variable (--variable)
 * @param {HTMLElement} element (document.documentElement)
 * @param {string} pseudoElt (:after)
 */
function getCssVariable(variable, element = document.documentElement, pseudoElt) {
  const isValid = /--[\S]*/g;
  let propertyValue = '';

  if (!isValid.test(variable)) {
    throw Error('The `variable` parameter is in an incorrect format');
  }

  if (element) {
    propertyValue = getComputedStyle(element, pseudoElt).getPropertyValue(variable);
  }

  return propertyValue.trim();
}

export default getCssVariable;

hexToRGB.js

/**
 * Parse hexadecimal to rgb format
 * @param {string} hex #FFFFFF or #FFF
 * @param {boolean} functional if true returns using rgb()
 */
function hexToRGB(hex, functional) {
  const isValidHex = /^#([\da-f]{3}){1,2}$/i;
  let red = 0,
    green = 0,
    blue = 0;

  if (!isValidHex.test(hex)) {
    throw Error('The `hexadecimal` parameter is in an incorrect format');
  }

  if (hex.length === 4) {
    red = '0x' + hex[1] + hex[1];
    green = '0x' + hex[2] + hex[2];
    blue = '0x' + hex[3] + hex[3];
  }

  if (hex.length === 7) {
    red = '0x' + hex[1] + hex[2];
    green = '0x' + hex[3] + hex[4];
    blue = '0x' + hex[5] + hex[6];
  }

  if (functional) return `rgb(${+red},${+green},${+blue})`;

  return `${+red},${+green},${+blue}`;
}

export default hexToRGB;