← Back to Code Phoropter
Phoropter Logo

About Code Phoropter

The systematic approach to finding your perfect code display settings

About This Project

Code Phoropter is an open-source tool designed to help developers find their ideal code display settings through systematic A/B testing. Just as an optometrist uses a phoropter to determine your optimal vision prescription, this tool helps you discover which fonts, sizes, and colors make your code most readable and comfortable for extended coding sessions.

The project uses a tournament-style comparison system to progressively narrow down your preferences across multiple dimensions: font family, size, weight, line height, and color scheme. Each comparison you make helps build a profile of your ideal coding environment.

Personal Background

As I've gotten older, I've noticed that reading code on screen has become more challenging than it used to be. What once seemed perfectly readable now strains my eyes, especially during long coding sessions or under different lighting conditions. The fonts and settings that worked well for me in my twenties no longer provide the same comfort and clarity.

This realization led me to experiment with different fonts, sizes, and color schemes, but the sheer number of combinations was overwhelming. Traditional "font showcases" show individual fonts in isolation, but don't help you systematically compare options or account for how different settings interact with your specific screen, lighting conditions, and visual needs.

I wanted a tool that could help me methodically test different combinations in various contexts – bright daylight, dim evening light, different monitor types, and varying distances from the screen. The idea of using a systematic, optometry-inspired approach emerged: rather than guessing or randomly trying settings, why not use the proven "which is better, 1 or 2?" methodology that eye doctors have used for decades?

Code Phoropter was born from this need – a tool that acknowledges that code readability is highly personal and context-dependent, and provides a scientific approach to finding your optimal settings through careful comparison rather than guesswork.

🔒 Privacy & External Requests

This page and the main app run fully in your browser. However, some configurations may request resources from third‑party CDNs (e.g., web fonts or libraries), and those providers may collect telemetry or set cookies according to their own policies.

Recommendations: For maximum privacy, self‑host fonts (place WOFF/TTF files under /fonts/) and disable remote font loading. We can add a toggle to force “local‑only” mode on request.

Available Fonts

Code Phoropter tests and compares a comprehensive collection of coding fonts from various sources:

Font Name Source Ligatures Notes Sample

Note: System fonts are only available if installed on your computer. Embedded fonts are loaded from a CDN or from this site when selected.

Color Schemes

Code Phoropter includes a comprehensive collection of color schemes inspired by popular developer themes:

Dark Themes

Theme Name Origin/Author Description Sample

Light Themes

Theme Name Origin/Author Description Sample

Technologies Used

GitHub

Code Phoropter is available on GitHub.

Repository: github.com/staffanm/code-phoropter

Credits & Acknowledgments