Mech Keyboard

A 75% mechanical keyboard drawn as an isometric illustration in three.js, with ink outlines and a volume knob. Keys press along with your real keyboard, and a recorder spells out the shortcut for onboarding flows.

Library

23rd.dev

Framework

React

Type

ui

Dependencies

three

Install

pnpm dlx shadcn@latest add @23rd/mech-keyboard

Files

• registry/mech-keyboard/mech-keyboard.tsx
• lib/utils.ts
• registry/mech-keyboard/mech-keyboard-vanilla.ts

Source

https://github.com/radiumcoders/23rd.dev

More from 23rd.dev

• ASCII Fluid
• ASCII Logo
• Dither Scan
• Dithered 404
• Folio
• Gooey Color Picker
• Iso Lattice
• Live Orb
• Logo Burst
• Phosphor Score
• Radiant Lines
• Ring Tower