Support of display-P3 color space

[iamgiannisx]

Hello,
Is there a way to use display-P3 color space
I am trying to change palette color from $palette-yellow: #f6d200; to $palette-yellow: color(display-p3 0.964706 0.823529 0/1); at /variables.scss and I am getting an error functions.scss:37:11": argument $colorofred($color) must be a color

Thanks.

[razonyang]

I don't think you can achieve this with Bootstrap variables, red function is not support display-p3 space.

You can override th palette by CSS, but I don't think it's worth it.

[data-palette='yellow'] {
    --hbs-primary: #984c0c;
    --hbs-primary-rgb: 152, 76, 12 !important;
    --hbs-primary-secondary: #7a3d0a;
    --hbs-primary-secondary-rgb: 122, 61, 10;
    --hbs-on-primary: #fff;
    --hbs-on-primary-rgb: 255, 255, 255;
    --hbs-primary-text: #6a3508 !important;
    --hbs-on-primary-secondary: #ccc;
    --hbs-on-primary-secondary-rgb: 204, 204, 204;
    --hbs-on-primary-disabled: #999;
    --hbs-on-primary-disabled-rgb: 153, 153, 153;
    --hbs-accent-bg: #984c0c !important;
    --hbs-accent-color: #fff !important;
    --hbs-accent-border: #984c0c !important;
}

[iamgiannisx]

ok thanks,

I assume I have to override [data-palette='yellow'][data-bs-theme='dark'] as well.