linear-gradient default interpolation

HTML

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="src/style.css">
  </head>
  <body>
    <div class="gradient in-srgb"><div class="label">in srgb</div></div>
    <div class="gradient default-names"><div class="label">Default Names</div></div>
    <div class="gradient default-rgb-syntax"><div class="label">Default rgb(0 0 255)</div></div>
    <div class="gradient default-hsl"><div class="label">Default hsl()</div></div>
    <div class="gradient in-hsl-hsl"><div class="label">in hsl, hsl()</div></div>
    <div class="gradient default-color-syntax"><div class="label">Default color(srgb 0 0 1)</div></div>
    <div class="gradient in-oklab"><div class="label">in oklab</div></div>
  </body>
</html>

CSS

html, body {
  height: 100%;
  margin: 0;
}
body {
  display: flex;
}
.gradient {
  flex: 1;
  border-right: solid 1px;
  padding: 5px;
}
.in-srgb {
  background-image: linear-gradient(in srgb to bottom, blue, red);
}
.default-names {
  background-image: linear-gradient(to bottom, blue, red);
}
.default-rgb-syntax {
  background-image: linear-gradient(to bottom, rgb(0 0 100%), rgb(100% 0 0));
}
.default-hsl {
  background-image: linear-gradient(to bottom, hsl(240 100% 50%), hsl(0 100% 50%));
}
.in-hsl-hsl {
  background-image: linear-gradient(to bottom in hsl, hsl(240 100% 50%), hsl(0 100% 50%));
}
.default-color-syntax {
  background-image: linear-gradient(to bottom, color(srgb 0 0 1), color(srgb 1 0 0));
}
.in-oklab {
  background-image: linear-gradient(in oklab to bottom, blue, red);
}