Which color scheme does the preloader use?

Were you able to figure out how to change the colors of the dots on the splash screen? I noticed on my site it’s all blue, where as on this discourse site it’s red to blue gradients.

See this:

So it can’t be done? I’m trying to figure out why my site has only blue dots for the loading screen where as this meta discourse site has red and blue dots? I’m using a stock install - does it mean that meta discourse is using a custom splash screen? It’s just the colors of the dots, I think I may be missing something basic.

Could you point to where in the theme I can find this? I’m trying to see why the dots are only blue on my site where as it’s red and blue on this site. My install is a stock install and about 10 years old.

EDIT: Does it use the Color palettes, if so which ones does it use, or, does it take from the theme and if so where can one modify it?

1 Like

I believe it uses the theme colors, if you really want, stuff like highlights.

Yeah I read that it’s not making sense. The themes use color palettes. I checked the palettes and they’re the stock ones. Now each one has sub headings like highlights and that for example is set to red, yet my site shows blue. Which sub headings are used to set the colors for the splash dots?

Splash screen uses 3 different color variables for dots.

1, 2: quarternary 3: highlight 4, 5: tertiary

2 Likes

Perfect, that worked. Thanks.

1 Like

Hi RBoy :slight_smile:

The splash screen code is here:

The exact colors used for the dots are:

.dots:first-child {
  fill: var(--quaternary);
}

.dots:nth-child(2) {
  fill: var(--quaternary);
  animation-delay: 0.15s;
}

.dots:nth-child(3) {
  fill: var(--highlight);
  animation-delay: 0.3s;
}

.dots:nth-child(4) {
  fill: var(--tertiary);
  animation-delay: 0.45s;
}

.dots:nth-child(5) {
  fill: var(--tertiary);
  animation-delay: 0.6s;
}

It uses the color scheme chosen by the user (I think?) and the default one if no specific theme/scheme was chosen (it will be the case for visitors, for instance).

1 Like

Just out of curiosity, but wasn’t this answered in:

https://meta.discourse.org/t/how-to-customize-the-loading-splash-screen/233016/10?u=jammydodger

https://meta.discourse.org/t/how-to-customize-the-loading-splash-screen/233016/11?u=jammydodger

Can we split and combine these somehow to keep the conversation in one place?

Yes they can be combined.

1 Like