Compatibility Tool

Visual compatibility checker

See keyboard layouts, keycap kits, and fit issues in one layered SVG view instead of reading raw compatibility tables.

This demo includes ISO Enter path rendering, north-facing interference warnings, and mock catalog data you can swap for real inventory later.

Keyboard Layout

Select PCB/Layout Spec

Keycap Kit

Select Keycap Set Spec

Compatibility score

99%

Total keys

Missing

Interference

CompatibleMissing / Size MismatchInterference Risk

Explosion: 44

1u = 50px · gap = 2px · keycap layer lifts and fades for exploded view.

Detected issues

Tab•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
Q•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
W•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
E•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
R•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
T•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
Y•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
U•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
I•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
O•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
P•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
[•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
]•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
\•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
Caps•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
A•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
S•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
D•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
F•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
G•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
H•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
J•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
K•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
L•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
;•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
'•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
Enter•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
Shift•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
Z•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
X•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
C•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
V•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
B•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
N•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
M•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
,•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
.•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
/•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.
R Shift•Missing / Size Mismatch→Need 1.75u, found 2.25/2.75u.
↑•Interference Risk→Possible north-facing switch interference with Cherry profile keycap.

Rendered with mock data

The checker follows a standardized contract, so you can replace mock entries with real keyboard/keycap catalogs later.

• Keyboard source: content/compatibility/keyboards.json
• Keycap source: content/compatibility/keycap-kits.json
• Logic source: lib/compatibility.ts
• Non-rect keycap path: ISO Enter via SVG Path

Keyboard JSON (sample)

{
  "keyboardName": "Keychron Q1 (75%)",
  "pcb_orientation": "north",
  "layout": [
    {
      "label": "Esc",
      "x": 0,
      "y": 0,
      "w": 1,
      "h": 1,
      "id": "esc"
    },
    {
      "label": "F1",
      "x": 2,
      "y": 0,
      "w": 1,
      "h": 1,
      "id": "f_row_1u"
    },
    {
      "label": "F2",
      "x": 3,
      "y": 0,
      "w": 1,
      "h": 1,
      "id": "f_row_1u"
    },
    {
      "label": "F3",
      "x": 4,
      "y": 0,
      "w": 1,
      "h": 1,
      "id": "f_row_1u"
    },
    {
      "label": "F4",
      "x": 5,
      "y": 0,
      "w": 1,
      "h": 1,
      "id": "f_row_1u"
    },
    {
      "label": "F5",
      "x": 6.5,
      "y": 0,
      "w": 1,
      "h": 1,
      "id": "f_row_1u"
    },
    {
      "label": "F6",
      "x": 7.5,
      "y": 0,
      "w": 1,
      "h": 1,
      "id": "f_row_1u"
    },
    {
      "label": "F7",
      "x": 8.5,
      "y": 0,
      "w": 1,
      "h": 1,
      "id": "f_row_1u"
    },
    {
      "label": "F8",
      "x": 9.5,
      "y": 0,
      "w": 1,
      "h": 1,
      "id": "f_row_1u"
    }
  ]
}

Keycap JSON (sample)

{
  "kitName": "GMK Olivetti Base (Mock)",
  "profile": "cherry",
  "includedKeys": [
    {
      "id": "esc",
      "w": [
        1
      ]
    },
    {
      "id": "f_row_1u",
      "w": [
        1
      ]
    },
    {
      "id": "tilde_1u",
      "w": [
        1
      ]
    },
    {
      "id": "num_1u",
      "w": [
        1
      ]
    },
    {
      "id": "minus_1u",
      "w": [
        1
      ]
    },
    {
      "id": "plus_1u",
      "w": [
        1
      ]
    },
    {
      "id": "backspace",
      "w": [
        2
      ]
    },
    {
      "id": "tab",
      "w": [
        1.5
      ]
    },
    {
      "id": "alpha_1u",
      "w": [
        1
      ]
    }
  ]
}