SASS/SCSS – Error: $color: currentColor is not a color

I have some issue when I want to generate Colors it show me an error messages contain

"Error: $color: currentColor is not a color."??

I dont know where this color coming from maybe the function that convert hex to rgb??

My Full Code :

// Function to Convert Hex Color to RGB Color

@function hexToRGB($hex) {
  @return red($hex), green($hex), blue($hex);
}

// Color Variables

$transparent:    transparent        !default;
$current:        currentColor       !default;
$white:          #fff               !default;

// Color Map

$shades: () !default;
$shades: map-merge(
    (
        "transparent":    $transparent,
        // The problem is Here it said :
        // currentColor is not a color.
        // Why??
        "current":        $current,
        "white":          $white,
    ),
    $shades
);

// Global Color Map

$colors: () !default;
$colors: map-merge(
    (
        "shades":    $shades,
    ),
    $colors
);

@each $name, $value in $colors {
    @each $shade, $color in $value {
        .color-#{$shade} {
            --color-example1: rgba(#{hexToRGB($color)}, 0);
        }
    }
}

The Result that I want to get after compiling to CSS :

.color-transparent {
  --color-example1: rgba(0, 0, 0, 0);
}

.color-current {
  --color-example1: rgba(255, 255, 255, 0);
}

.color-white {
  --color-example1: rgba(255, 255, 255, 0);
}


Read more here: https://stackoverflow.com/questions/64959198/sass-scss-error-color-currentcolor-is-not-a-color

Content Attribution

This content was originally published by jhon-jhones at Recent Questions - Stack Overflow, and is syndicated here via their RSS feed. You can read the original post over there.

%d bloggers like this: