<div style="container-type: inline-size;">
<div style="display: grid; grid-template: repeat(2, 16cqw) / repeat(2, 50cqw); border-radius: 0.5em; overflow: hidden; font-family: var(--font-monospace); font-size: 8cqw;">
<div style="display: flex; align-items: center; justify-content: center; background-color: #a08cc0; color: #fff; overflow: hidden;">Purplrue</div>
<div style="display: flex; align-items: center; justify-content: center; background-color: #fff; color: #a08cc0; overflow: hidden;">Purplrue</div>
<div style="display: flex; align-items: center; justify-content: center; background-color: #000; color: #a08cc0; overflow: hidden;">Purplrue</div>
<div style="display: flex; align-items: center; justify-content: center; background-color: #a08cc0; color: #000; overflow: hidden;">Purplrue</div>
</div>
</div>
## Hex Code
```
#a08cc0
```
```
#A08CC0
```
## Color Spaces
```
oklch(67.66% 0.0784 301.96)
```
```
hsl(263.08, 29.21%, 65.1%)
```
```
rgb(160, 140, 192)
```
## 1 pixel image
```
data:image/gif;base64,R0lGODdhAQABAIABAAAAAKCMwCwAAAAAAQABAAACAkwBADs=
```
```url
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNc0HPgPwAGrQLtpocD7AAAAABJRU5ErkJggg==
```