Someone built an x86 CPU emulator using pure CSS, for science

CSS was never meant to do this, but it actually works

by · TechSpot

Serving tech enthusiasts for over 25 years.
TechSpot means tech analysis and advice you can trust.

In context: Thanks to JavaScript, WebAssembly, and other modern web standards, it is now possible to run a wide range of applications directly in a web browser. Programmer Lyra Rebane went even further by (ab)using Cascading Style Sheets to emulate a partially functional x86 processor.

The recently unveiled x86CSS project aims to emulate an x86 processor within a web browser. Unlike many other web-based emulators, Lyra Rebane's implementation is written entirely in CSS. More precisely, the x86CSS page hosts a C program compiled with GCC into native 8086 machine code, which is then executed through CSS-based logic.

Using "pure" Cascading Style Sheets to emulate a processor is not a common programming approach. CSS is primarily used to control the visual presentation and layout of web documents and is traditionally considered one of the foundational technologies of the modern World Wide Web, alongside HTML and JavaScript.

As Rebane explains on the project's homepage, advanced CSS features such as if() statements, style queries, and custom functions have enabled CSS to behave more like a general-purpose programming language. However, these capabilities are currently available only in Chrome and other Chromium-based browsers, meaning x86CSS is unlikely to support Firefox or non-Chromium browsers in the near future.

The programmer notes that she did not use large language models or other forms of artificial intelligence in developing the project, explaining that she does not believe "you can build a project like this with an LLM."

The x86CSS emulator still relies on a small JavaScript component to provide clock synchronization for the CSS-based execution model. However, it can revert to an entirely CSS-based implementation if script execution is disabled or unavailable in the browser. The emulator's webpage also requires a minimal amount of HTML because there is no way to load a stylesheet without basic document structure.

// Related Stories

Rebane notes that the emulator implements the original 16-bit instruction set of the Intel 8086 processor, while omitting some additional instructions and features to improve performance. The x86CSS code can execute third-party binary software, but users must build and compile their own customized version of the emulator.

Implementing a portion of the original x86 instruction set architecture (ISA) using CSS is technically impressive, although the resulting system is not a practical emulation environment. The project operates slowly and does not include the additional components typically required to run custom DOS software in a DOSBox-like runtime. Nevertheless, it is reportedly capable of "running" Horsle for reasons that are not entirely clear.