Tomi Chen

Tomi’s Blog

Sometimes I make things, and sometimes I’ll write about what I’ve made. This blog aims to explain my thought process behind decisions I make, as well as other things I find interesting.

See all posts.

RSS Feed.

Latest Posts

APR. 16, 2022

Responsive Images in Markdown with Eleventy Image

I love markdown's simplicity and convenience, but sometimes you need a little more than the default image tag. In this post, I walk through how responsive images (with the picture tag) are handled on this blog in a way that doesn't compromise the authoring experience.


APR. 10, 2022

A Contrast-Focused Color Picker

Choosing colors with good contrast is a critical part of accessible design in all formats and mediums, but it can be difficult to pick these colors with tooling that wasn’t created with contrast in mind. I’ve always wanted to have a color picker that would visually display which colors had sufficient contrast against a base color, but couldn’t find any existing tools that had this feature. So I built it myself!


JAN. 18, 2022

Redesigning SciOlyID: My process for building websites

sciolyid logo and text

This post will outline my process for building and designing websites, from planning to production. I'll go into how I redesigned the SciOlyID website through structure, functionality, and design.


SEP. 5, 2021

Tracking Positive COVID-19 Cases in My School District

covid tracker social image

Last month, school started in person, and while masks are required, students are still crowded into classrooms. Our school district has a Positive Case Dashboard that lists the number of students and staff on campuses that test positive for COVID-19, but no historical tracking or info on daily changes. I decided to use Simon Willison’s git scraping technique to store historical data about positive cases and track changes over time.


JUN. 9, 2021

Improving Mobile and Keyboard Usability in TwemojiExplorer

I recently built TwemojiExplorer, a website that gives convenient access to Twitter's Twemoji emoji set. Since the site is primarily a tool for my personal use, I did not put too much thought into keyboard or mobile usability during the initial development process. Now that I have a bit of time, I decided to tweak a couple of small things to make the experience better.


JUN. 8, 2021

Searching and Displaying Large Datasets with Svelte

social image

Searching large datasets can be a challenge, especially with live updates as the user types. Not only is re-rendering thousands of DOM nodes taxing on memory, but the heavy processing involved can also make the page unresponsive. Here, I'll share my process of working through these issues and improving the user experience on a new project.