Doodle is a pure Kotlin UI framework for building applications that run on both the Web and the Desktop, aimed at developers who want to write their entire interface in Kotlin across JVM, JavaScript, and Wasm targets.

What it is

Doodle is an open-source, MIT-licensed GUI framework written entirely in Kotlin and part of the Kotlin Multiplatform ecosystem. It targets three runtimes — JVM for desktop applications, and JavaScript and WebAssembly for the browser — so a single View hierarchy and business logic layer can be written once and shipped to both Web and Desktop. Its package root is io.nacular.doodle, and the example application wires itself up with a small application entry point that hands an Application implementation a Display instance.

The concrete problem it addresses is that building complex, precisely laid-out user interfaces in Kotlin normally means reaching for a browser DOM, a canvas toolkit, or a platform-specific widget set, each with its own layout rules and rendering quirks. Doodle replaces that patchwork with its own render model, which the project describes as intuitive yet powerful enough to achieve complex UIs with pixel-level precision in layouts. The same model governs user input and drag and drop, so animation, custom drawing, and interaction all work through one consistent mechanism rather than separate browser and desktop APIs.

Key capabilities

• Targets three Kotlin runtimes — JS, Wasm, and JVM — under a single multiplatform codebase, as the project's build badges indicate.
• Provides a render model designed for pixel-level precision in layouts, letting developers compose complex UIs rather than simple widget grids.
• Exposes a View hierarchy in which a View's size and render function are set directly, as the Hello World example shows with size = display.size and a render lambda that draws text("Hello, world!", color = Black).
• Supports drag and drop through the same abstraction used for ordinary user input, rather than as a separate subsystem.
• Allows arbitrary drawing and animation through the drawing API, including primitives such as text(...) from io.nacular.doodle.drawing.
• Ships a first-class Display object that acts as the root container, onto which views are added with +=.
• Uses Kodein dependency injection in its application bootstrap, as shown by the org.kodein.di.instance import in the example.

Who uses it and how

• Kotlin developers who want to deploy the same application to a browser and to a desktop JVM without maintaining two UI codebases.
• Teams building object-oriented, custom-drawn interfaces where standard widget sets are too constraining and layouts must be exact.
• Contributors and learners working from the official documentation site and the companion doodle-tutorials repository, which provide worked examples and an introduction to the framework.
• Community members who report issues and feature requests on the GitHub tracker and discuss usage in the #doodle channel on Kotlin Slack.

Getting started

The README defines the entry point directly: you implement the Application interface, register views against the injected Display, and launch it from a main function that calls application { ... }. Full setup instructions, examples, and API references live on the project's documentation site and the doodle-tutorials repository.

How it compares

The project's own documentation names no competing UI toolkits against which to measure it, so Doodle stands alone in this registry on that axis.

When to use it — and when not

The project states plainly that it is still under active development, so users should expect gaps and bugs and be prepared to file issues rather than assume production polish. It is a poor fit for teams that need a stable, long-supported widget library or that would rather rely on mature browser-native tooling, and its sparse installation instructions mean a newcomer should budget time to work through the documentation and tutorials before building.

import io.nacular.doodle.application.Application
import io.nacular.doodle.application.application
import io.nacular.doodle.core.Display
import io.nacular.doodle.core.plusAssign
import io.nacular.doodle.core.view
import io.nacular.doodle.drawing.Color.Companion.Black
import io.nacular.doodle.drawing.text
import org.kodein.di.instance

class HelloWorld(display: Display): Application {
    init {
        display += view {
            size   = display.size
            render = {
                text("Hello, world!", color = Black)
            }
        }
    }

    override fun shutdown() {}
}

fun main() {
    application {
        HelloWorld(display = instance())
    }
}