Create pictures, animations, and video games with OCaml!

This is a port of the excellent Elm playground package https://github.com/evancz/elm-playground to OCaml.

This is the package I wanted when I was learning programming. Start by putting shapes on screen and work up to making games. I hope this package will be fun for a broad range of ages and backgrounds! - Evan Czaplicki

• Getting started (this file)
• Tutorial
• Basic examples
• Basic games
• API reference
• Index
• Changelog

The OCaml elm_playground package allows you to easily create pictures, animations, and even video games in a portable way using an API that really simplifies how to view the computer and its devices (the screen, keyboard, and mouse).

The goal is similar to the old graphics package but goes even further in terms of simplification.

The main API is defined in a single Playground.mli module and is implemented by two backends:

• a native (SDL-based) backend to run your game on your desktop from a terminal
• a web (vdom-based) backend to run your game in a browser

Here is for example a simple Snake game you can run from your browser (use the arrow keys to change the direction of the snake and eat the ball to grow your length). You can run the same game on your desktop without changing a line of code.

To install the playground, run opam install elm_playground and then install one or both backends with opam install elm_playground_native and/or opam install elm_playground_web.

Here is a very simple application using the playground:

open Playground

(* the (x, y) position of the blue square  *)
type model = (float * float)

let initial_state : model = (0., 0.)

let view _computer (x, y) = [ 
  square blue 40.
   |> move x y
 ]

let update computer (x, y) =
  (x +. to_x computer.keyboard, y +. to_y computer.keyboard)

let app = 
  game view update initial_state

let main = Playground_platform.run_app app

It is a very simple game defining a model type, a view function, and an update function to specify how the game behaves. It is using the "Model-View-Update" architecture to organize the code of a graphical interactive application (see https://guide.elm-lang.org/architecture/ for more information).

To compile this application, simply do:

$ cd docs/toy-native-example
$ opam install --deps-only --yes .
$ dune exec --root . ./Toy.exe

You should then see on your desktop:

If you type on the arrow keys on your keyboard the blue square should move in the corresponding direction. If you type q it will exit the game.

Note that with the Playground API the center of the screen is at (0, 0).

To compile this same application for the web, simply do:

$ cd docs/toy-web-example
$ opam install --deps-only --yes .
$ dune build --root .
$ cp _build/default/Toy.bc.js static/

You should then be able to use the web app by going to: https://aryx.github.io/ocaml-elm-playground/toy-web-example/static/Toy.html

By default the generated javascript file can be big so to get a smaller one you can do instead:

$ dune build --root . --profile=release
$ cp _build/default/Toy.bc.js static/

Read the tutorial at: https://aryx.github.io/ocaml-elm-playground/elm_playground/

Look at the code under examples/ and games/.

Here is a screenshot of the Tetris Playgound game running:

You can even try it online here

You can see a few more screenshots here.

The API and ideas behind the code of this library are the work of Evan Czaplicki for Elm at https://github.com/evancz/elm-playground I (Pad) mostly ported the API and ideas, as well as some of the web backend code, to OCaml. I then added also a native backend (using tsdl), which was not in the Elm version (Elm is a web language). The final library is very small, less than 3000 LOC.

I recently (Sep 2026) used Claude Code to fix many small bugs and now about 20% of the code is written by Claude Code (especially the code to handle animaged GIFs).