is it possible to change the background colour behind transitions?

[gavJackson]

I spent a work hackathon day experimenting with adding it to our app and was largely successful although I couldn't work out how to change the colour behind the transitions.

I have background-color and background gradients styles on the html, body and my low level DOM nodes but whatever I try I still get a white background behind the transitions. This isn't too bad on light skins, but we also have a dark mode and it looks pretty jarring then, is there something simple I am missing? or is this something else that needs adding to the spec? I even tried adding a background colour to the psuedo page transition elements. This image shows what I mean:

p.s. I am blown away by this API, its very cool! a couple of years ago i tried implementing my own screenshot capturing transition system...not easy! I totally appreciate this, especially the DOM flattening.

[jakearchibald]

Glad you had fun with the API!

For the background colour, did you try:

::page-transition {
  background: black;
}

[gavJackson]

amazing thanks, that got it - much appreciated