:root {
    --blue-gray-50: #ECEFF1;
    --blue-gray-100: #CFD8DC;
    --blue-gray-200: #B0BEC5;
    --blue-gray-300: #90A4AE;
    --blue-gray-400: #78909C;
    --blue-gray-500: #607D8B;
    --blue-gray-600: #546E7A;
    --blue-gray-700: #455A64;
    --blue-gray-800: #37474F;
    --blue-gray-900: #263238;

    --blue-50: #E3F2FD;
    --blue-100: #BBDEFB;
    --blue-200: #90CAF9;
    --blue-300: #64B5F6;
    --blue-400: #42A5F5;
    --blue-500: #2196F3;
    --blue-600: #1E88E5;
    --blue-700: #1976D2;
    --blue-800: #1565C0;
    --blue-900: #0D47A1;
    
    --purple: #aa69ff;
    
    --white: #FAFBFC;
    --off-white-blue: #E8F2F7;
    --off-white-green: #E8F1EC;
    --off-white-yellow: #F9F3DC;
    --off-white-purple: #F3EBF9;
    --off-white-red: #FCE9E7;
    --off-white-pink: #FAE9F1;
    --off-white-brown: #F5EDE9;

}