Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
PICO-8 devkit keyboard
[
{
"backcolor": "#C2C3C7",
"name": "PICO-8 devkit keyboard",
"author": "tobiasvl",
"switchMount": "cherry",
"switchBrand": "cherry",
"switchType": "MX1A-G1xx"
},
[
{
"c": "#83769C",
"t": "#FFF1E8"
},
"Esc",
{
"c": "#5F574F"
},
"F1",
"F2",
"F3",
"F4",
"F5",
"F6",
"F7",
"F8\n\n\n<span class=\"rec\"></span>",
"F9\n\n\n<span class=\"stop\"></span>",
"F10",
"F11",
"F12",
"PrS",
"Ins",
"Del"
],
[
{
"c": "#FFF1E8",
"t": "#000000"
},
"§\n|",
"!\n1",
{
"a": 0
},
"\"\n2\n\n@\nC#",
"#\n3\n\n£\nD#",
{
"a": 4
},
"¤\n4\n\n$",
{
"a": 0
},
"%\n5\n\n\nF#",
"&\n6\n\n\nG#",
"/\n7\n\n{\nA#",
{
"a": 4
},
"(\n8\n\n[",
")\n9\n\n]",
"=\n0\n\n}",
"?\n+",
"`\n\\\n\n'",
{
"c": "#5F574F",
"t": "#FFF1E8",
"a": 6,
"f": 2,
"w": 2
},
"Backspace",
"Ê"
],
[
{
"f": 3,
"w": 1.5
},
"Tab",
{
"c": "#FFF1E8",
"t": "#000000",
"a": 0
},
"Q\n\n\n\nC",
"W\n\n\n\nD",
"E\n\n\n\nE",
"R\n\n\n\nF",
"T\n\n\n\nG",
"Y\n\n\n\nA",
"U\n\n\n\nB",
{
"a": 4
},
"I",
"O",
"P",
"a",
"^\n\"\n\n~",
{
"x": 0.25,
"c": "#5F574F",
"t": "#FFF1E8",
"w": 1.25,
"h": 2,
"w2": 1.5,
"h2": 1,
"x2": -0.25
},
"<span class=\"custom-glyph-1\"></span>",
"End"
],
[
{
"a": 6,
"w": 1.25,
"w2": 1.75,
"l": true
},
"Aa",
{
"x": 0.5,
"c": "#FFF1E8",
"t": "#000000",
"a": 4
},
"A",
{
"a": 0
},
"S\n\n\n\nC#",
"D\n\n\n\nD#",
{
"a": 4,
"n": true
},
"F",
{
"a": 0
},
"G\n\n\n\nF#",
"H\n\n\n\nG#",
{
"n": true
},
"J\n\n\n\nA#",
{
"a": 4
},
"K",
"L",
"o",
"ae",
"*\n'",
{
"x": 1.25,
"c": "#5F574F",
"t": "#FFF1E8"
},
"PgUp"
],
[
{
"a": 6,
"w": 1.25
},
"",
{
"c": "#FFF1E8",
"t": "#000000",
"a": 4
},
">\n<",
{
"c": "#FF004D",
"t": "#FFF1E8",
"a": 0
},
"Z\n\n\n\nC\n\n\nÎ",
"X\n\n\n\nD\n\n\n×",
{
"c": "#FFF1E8",
"t": "#000000"
},
"C\n\n\n\nE",
"V\n\n\n\nF",
"B\n\n\n\nG",
"N\n\n\n\nA",
"M\n\n\n\nB",
{
"a": 4
},
";\n,",
":\n.",
"_\n-",
{
"c": "#5F574F",
"t": "#FFF1E8",
"a": 6,
"w": 1.75
},
"",
{
"c": "#FF004D",
"a": 7
},
"Ô",
{
"c": "#5F574F"
},
"PgDn"
],
[
{
"w": 1.25
},
"Æ",
"Ï",
{
"a": 6,
"w": 1.25
},
"Alt",
{
"c": "#83769C",
"a": 7,
"w": 6
},
"",
{
"c": "#5F574F",
"f": 2,
"w": 1.25
},
"Å",
{
"f": 3
},
"Menu",
{
"w": 1.25
},
"Æ",
{
"c": "#FF004D"
},
"Ë",
"Ã",
"Ñ"
]
]
@font-face {
font-family: 'PICO-8';
src: url(https://thespug.net/stuff/pico-8_wide.ttf) format('truetype');
}
* { font-family: 'PICO-8'; }
.custom {}
.custom-glyph-1:after {
/* Set the background for this glyph to your image */
background-image: url('https://thespug.net/stuff/pico-8_enter.png');
background-repeat: no-repeat;
background-position: center;
/* Content is required for it to appear; this is a non-breaking-space */
content:'';
display:inline-block;
/* Sizing in EMs allows the glyph to scale with the font-size */
width: 1.5em;
height: 2em;
background-size: 1.5em;
}
.rec:after {
/* Set the background for this glyph to your image */
background-image: url('https://thespug.net/stuff/pico-8_rec.png');
background-repeat: no-repeat;
background-position: center;
/* Content is required for it to appear; this is a non-breaking-space */
content:'';
display:inline-block;
/* Sizing in EMs allows the glyph to scale with the font-size */
width: 1em;
height: 1em;
background-size: 1em;
}
.stop:after {
/* Set the background for this glyph to your image */
background-image: url('https://thespug.net/stuff/pico-8_stop.png');
background-repeat: no-repeat;
background-position: center;
/* Content is required for it to appear; this is a non-breaking-space */
content:'';
display:inline-block;
/* Sizing in EMs allows the glyph to scale with the font-size */
width: 1em;
height: 1em;
background-size: 1em;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.