extra.css/confetti/style.css

body {
  background: #03051a;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  width: 100vw;
  margin: 0;
}

h1 {
  color: white;
  display: block;
  font-family: monospace;
  font-size: 4rem;
  font-weight: 100;
}

@supports (background: paint(something)) {
  h1 {
    /* 
      Optionally set property values. 
      This can be done at root or local scope 
    */
    --extra-confettiNumber: 40; /* defaults to 30 */
    --extra-confettiLengthVariance: 12; /* Defaults to 15 */
    --extra-confettiWeightVariance: 3; /* Defaults to 4 */
  
    background: paint(extra-confetti);
  }
}