sandbox
about
name
modified
files
2023—01
components
2023-01
mosaic
2022—11
atom
2021—08
keyboard
2021—05
hoverstates
2021—04
music-label
2021—03
nyt
2019
formfield is the homepage of Kevin Xia, designer at Meter
email twitter
PDT
 
colors
900
300
800
300
700
300
600
300
500
300
400
900
300
500
200
500
100
500
0
500
typography
Aa
Menlo 
12/14
Aa
Menlo 
10/10
formfield.com
A
assets
3
S
scripts
2
D
description
1
F
font
1
arrow.svg
location.svg
orb.css
folder
properties
3 items
size
4 KB
arrow.svg
properties
svg image
size
499 B
dimensions
10x10
created
01/05/21
location.svg
properties
svg image
size
695 B
dimensions
10x10
created
01/05/21
orb.css
properties
css
size
550 B
dimensions
10x10
created
01/05/21
1
// theme
2
/* click the orb to toggle themes */
3
var dark = document.querySelector('.light');
4
dark.addEventListener('click', function () {
5
  var dark = document.querySelector('head');
6
  dark.innerHTML = dark.innerHTML.replace('@media 
 
  (prefers-color-scheme: dark)', '@media 
 
  (prefers-color-scheme: light)');
7
});
8
var light = document.querySelector('.dark');
9
light.addEventListener('click', function () {
10
  var light = document.querySelector('head');
11
  light.innerHTML = light.innerHTML.replace('@media 
 
  (prefers-color-scheme: light)', '@media 
 
  (prefers-color-scheme: dark)');
12
});
13
 
14
// keyboard shortcuts
15
/* press 'tab', or press '1' and '2' to switch between tabs */
16
var about = document.getElementById('about');
17
var sandbox = document.getElementById('sandbox');
18
var current = about;
19
var btns = document.getElementsByClassName('btn');
20
var current = btns[0];
21
document.onkeydown = function (e) {
22
  if (e.keyCode == 49) {
23
    sandbox.click();
24
  }
25
  if (e.keyCode == 50) {
26
    about.click();
27
  }
28
  if (e.keyCode == 9) {
29
    e.preventDefault();
30
    current.click();
31
    current = (current == btns[0]) ? btns[1] : btns[0];
32
  }
33
}
1
// bio
2
formfield is the homepage of Kevin Xia, designer at Meter
Aa
menlo.ttf
folder
properties
1 item
size
1.3 MB
menlo.ttf
properties
TrueType® OpenType® font
size
1.3 MB
foundry
Apple, Inc
created
28/08/09
PDT
 
2.1 MB