This extension will find any custom element on a page. Custom Elements Locator →
Tag Archives: link
The UX of LEGO Interface Panels
George Cave takes a look at the UX of the LEGO Interface Panels These iconic, low-resolution designs are the perfect tool to learn the basics of physical interface design. Armed with 52 different bricks, let’s see what they can teach us about the design, layout and organisation of complex interfaces. The UX of LEGO Interface …
tinykeys – A tiny and modern library for keybindings
Small and lightweight, I like: import tinykeys from "tinykeys" tinykeys(window, { "Shift+D": () => { alert("The 'Shift' and 'd' keys were pressed at the same time") }, "y e e t": () => { alert("The keys 'y', 'e', 'e', and 't' were pressed in order") }, "$mod+KeyD": () => { alert("Either 'Control+d' or 'Meta+d' were …
Continue reading “tinykeys – A tiny and modern library for keybindings”
Native Image Lazy-Loading: loading-attribute-eagle-polyfill
Today, Rick Viscomi noted that some sites have set eagle – instead of eager – as the value for Native Image Lazy-Loading: Native image lazy loading landed months ago in Chrome 76. You can set img[loading] to auto, lazy, or eager. According to @HTTPArchive, 34 websites are setting it to loading="eagle" 🤔 There's a Lord …
Continue reading “Native Image Lazy-Loading: loading-attribute-eagle-polyfill“
Checkboxland – Render anything as HTML checkboxes
Checkboxland is a JavaScript library for rendering anything as HTML checkboxes. You can use it to display animations, text, and arbitrary data. It also supports plugins, so you can build more powerful APIs on top of it. Heh. Can’t quite think of a reason when exactly to use this, but it’s fun nonetheless 😅 Checkboxland …
Continue reading “Checkboxland – Render anything as HTML checkboxes”
SPACEX – ISS Docking Simulator
This simulator will familiarize you with the controls of the actual interface used by NASA Astronauts to manually pilot the SpaceX Dragon 2 vehicle to the International Space Station. Successful docking is achieved when all green numbers in the center of the interface are below 0.2. Movement in space is slow and requires patience & …
Chrome DevTools Pong – A game to play inside the Chrome DevTools
Move over Chrome Dino Game! Now you can play Pong inside the Chrome DevTools. Chrome DevTools Pong → Spoiler: How it works In case you were wondering: it’s a regular Pong game, but with the elements visually hidden (opacity: 0;) so that they only show up in the DevTools’ Layers Panel. So simple, that becomes …
Continue reading “Chrome DevTools Pong – A game to play inside the Chrome DevTools”
Scunthorpe Sans 🗯🚫 profanity-blocking font
A s*** font that f***ing censors bad language automatically Some clever use of ligatures there 🙂 Scunthorpe Sans → Via Jeremey Related: keming, a new typographical term →
Remix – React Framework for Web Apps
The past few weeks I’ve been enjoying the newsletter of Remix, an yet to be released React Framework Remix is a web application framework for React from the authors of React Router: Michael Jackson and Ryan Florence. It provides APIs and conventions for server rendering, data loading, routing and more. You can also read some …
This Word Does Not Exist
Every time you visit “This Word Does Not Exist” it will spit out a word that does not exist, along with its description and an example sentence containing the word. This Word Does Not Exist uses an artificial intelligence model named GPT-2 to invent new English words. Some fun results in there 🙂 This Word …