From 24edca23f0deaf4f820120aeb372e08497b15b8a Mon Sep 17 00:00:00 2001
From: Andrey Sitnik <andrey@sitnik.ru>
Date: Thu, 3 Oct 2024 23:43:11 +0000
Subject: [PATCH] Show fallback vs P3 in range

---
 view/range/index.ts | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/view/range/index.ts b/view/range/index.ts
index 5b051cd..49a8e25 100644
--- a/view/range/index.ts
+++ b/view/range/index.ts
@@ -5,7 +5,8 @@ import {
   canvasFormat,
   fastFormat,
   generateGetSpace,
-  Space
+  Space,
+  toRgb
 } from '../../lib/colors.js'
 import { getBorders } from '../../lib/dom.js'
 import {
@@ -70,10 +71,15 @@ function paint(
     let space = getSpace(color)
     if (space !== Space.Out) {
       ctx.fillStyle = canvasFormat(color)
-      ctx.fillRect(x, 0, 1, height)
       if (space !== Space.sRGB) {
+        ctx.fillRect(x, halfHeight, 1, halfHeight)
         ctx.fillStyle = space === Space.P3 ? borderP3 : borderRec2020
         ctx.fillRect(x, halfHeight, 1, 1)
+        let fallback = toRgb(color)
+        ctx.fillStyle = fastFormat(fallback)
+        ctx.fillRect(x, 0, 1, halfHeight)
+      } else {
+        ctx.fillRect(x, 0, 1, height)
       }
       if (prevSpace !== space) {
         if (