Skip to content

Instantly share code, notes, and snippets.

@kobitoDevelopment
Last active October 20, 2025 03:30
Show Gist options
  • Select an option

  • Save kobitoDevelopment/fd72edffdd6b12a82a5d9a8539ecaae3 to your computer and use it in GitHub Desktop.

Select an option

Save kobitoDevelopment/fd72edffdd6b12a82a5d9a8539ecaae3 to your computer and use it in GitHub Desktop.
.box {
width: 300px;
aspect-ratio: 1/1;
}
.opacity {
background-color: red;
opacity: 0.7;
}
.opacity-mix {
background-color: color-mix(in srgb, red 70%, transparent);
}
.color-mix {
background-color: color-mix(in srgb, green 50%, blue 50%);
}
<div class="box opacity"></div>
<div class="box opacity-mix"></div>
<div class="box color-mix"></div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment