Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (vundefined)
// Compass (vundefined)
// dart-sass (v1.18.0)
// ----

@import "color-helpers";  

// PF CORE vars
$pfelements--red: #e00;
$pf-color-red-50:                #faeae8 !default;
$pf-color-red-100:               #c9190b !default;
$pf-color-red-200:               #a30000 !default;
$pf-color-red-300:               #7d1007 !default;
$pf-color-red-400:               #470000 !default;
$pf-color-red-500:               #2c0000 !default;

// PFE vars
$pfe-color--red-50:              $pf-color-red-50;
$pfe-color--red-100:             $pf-color-red-100;
$pfe-color--red-200:             $pf-color-red-200;
$pfe-color--red-300:             $pf-color-red-300;
$pfe-color--red-400:             $pf-color-red-400;
$pfe-color--red-500:             $pf-color-red-500;   
$pfe-color--red-600:             darken($pfelements--red, 10%) !default;
$pfe-color--red-700:             darken($pfelements--red, 20%) !default;
$pfe-color--red-800:             darken($pfelements--red, 30%) !default;

// DEMO CLASSES
.feedback--critical--lightest {
  color: $pfe-color--red-50;
}

.feedback--critical {
   color: $pfe-color--red-600;
}
.feedback--critical--darkest {
  color: $pfe-color--red-800;
}
 
// Need to add:
.feedback--border {
  color: $pfe-color--red-100;
}

SassMeister-output.css

.feedback--critical--lightest {
  color: #faeae8;
}

.feedback--critical {
  color: #bb0000;
}

.feedback--critical--darkest {
  color: #550000;
}

.feedback--border {
  color: #c9190b;
}