{
  "about": "An entry of UpFork's ledger. Check it by hand as https://upfork.dev/docs/ledger says, or at https://upfork.dev/verify/E-210",
  "entry": {
    "seq": 210,
    "kind": "lesson-version",
    "record": "{\"ai\":{\"apps\":[\"Claude\"],\"models\":[\"Claude Opus 5.5\"]},\"article\":\"confirm-button-a-liquid-two-step-delete-for-react-native-and-seven-skia-trap\",\"articleRevision\":1,\"assumed\":\"a colour handed to a Skia `<Canvas>` shows on the web as the same sRGB colour it does in CSS.\",\"author\":{\"account\":\"a_9d470b566acab5f65bdc\",\"handle\":\"ramin-valadan\"},\"evidence\":\"the build's pixel samples before and after; oklab.ts lines 34–60; commits 9604802 and 8f6724b; `lib/web-colors.tsx` in Goal Ring and Gooey Tab Bar.\",\"fix\":\"on the web, Confirm Button turns its OKLab colours into linear sRGB, converts them with the linear sRGB to linear Display P3 matrix, and encodes the result; the same sample then read (215, 52, 58). Goal Ring and Gooey Tab Bar later got a general version, `WebColors`: the canvas's content is drawn into a layer whose colour filter does the same conversion in linear light, and only where the browser has P3 canvases (`'drawingBufferColorSpace' in WebGL2RenderingContext.prototype`). Goal Ring's `#22C55E`, which had shown as `#00C952`, then read `#22C55E`.\",\"happened\":\"the danger red `#D7343A`, (215, 52, 58), came out as (234, 20, 49) in the screenshot, while the greys were exact. A plain square filled with the literal colour did the same, so it wasn't the blending or the shadow. On the web, React Native Skia's view sets the WebGL2 context's `drawingBufferColorSpace` to `\\\"display-p3\\\"` whenever it sizes its canvas (`SkiaPictureView.web.js`), and CanvasKit still writes the sRGB numbers it's given, so the browser reads them as P3 numbers, with wider primaries: more saturation. Greys are the same numbers in both spaces, so they don't move.\",\"kind\":\"not-in-docs\",\"learnedBy\":\"ai\",\"lesson\":\"L-D7H0\",\"packages\":\"@shopify/react-native-skia@2.6.2\",\"product\":\"confirm-button-react-native\",\"productRevision\":1,\"publishedAt\":\"2026-10-26T13:19:26.932Z\",\"site\":\"https://upfork.dev\",\"title\":\"React Native Skia's web canvas is Display P3 but draws the sRGB numbers it gets: saturated colours come out stronger\",\"type\":\"lesson-version\",\"url\":\"https://upfork.dev/lessons/L-D7H0\",\"version\":1,\"why\":\"\"}",
    "recordHash": "8156dc439b5914e7cb6c21fcd12025bd86bc466464902f9d2db69f837f1562b2",
    "prevHash": "73ed0ac8730e2dd715c9ec5f6d15764a2281adcef9cdb0073a96cf82c3300313",
    "entryHash": "055251d76375742e58e9be486f241e463da9843f2322cf7e3beea730064969ea",
    "keyId": "k1",
    "signature": "/0HKiJcSAfa6aI133kPebspp9H3uOgZhQiihiXUxQvVza8v6iTYxk14YwjNqnbEnsB0QDhNl/nAZ0rscpls1CA==",
    "recordedAt": "2026-10-26T13:20:08.832646+00:00",
    "publicKey": "VuHuHXAtO3XAqgnwvMenp0f/3vTV061hnAIizYvwh40=",
    "algorithm": "Ed25519"
  },
  "path": [],
  "checkpoint": null,
  "keys": "https://upfork.dev/ledger/keys.json"
}