Flutter Flame Game Engine

The most popular 2D game engine for Flutter, with a component-based toolkit covering the game loop, sprites, effects, collision, and input. Docs at flame-engine.org.

🔥

Introduction

Flame is a lightweight, community-driven 2D game engine built on top of Flutter. It is designed as a toolbox rather than a heavyweight editor: developers write all game logic in Dart and compose the game from components that plug into Flutter's rendering and widget system. This makes it a natural fit for anyone already working in the Flutter ecosystem.

The engine is distributed as a single package on pub.dev at pub.dev/packages/flame, with official documentation and tutorials hosted at docs.flame-engine.org. Flame does not enforce a specific way of working; instead it offers ready-made answers to the common problems in 2D game development, such as sprites, animations, scenes, effects, collision detection, and input.

Flame is best known as the go-to engine for 2D games written in Dart on iOS, Android, web, and desktop. Because it reuses Flutter's game loop and canvas, game code stays familiar and testable, and the same project can target mobile, web, Windows, macOS, and Linux without a separate editor runtime.

Key Features

  • Game loop - a continuous update and render cycle managed by FlameGame, the heart of every Flame project
  • Component system (FCS) - break a game into small, reusable parts such as SpriteComponent, PositionComponent, and TextComponent
  • Effects and particles - built-in tween-style effects (move, scale, rotate, opacity) plus ParticleComponent for visual flair
  • Collision detection - hitboxes (HitboxCircle, HitboxRectangle, HitboxPolygon) with callbacks and the HasCollisionDetection mixin
  • Gesture and input handling - tap, drag, and keyboard detectors such as TapDetector and KeyboardEvents
  • Visual primitives - images, sprites, sprite sheets, animations, and general utilities for drawing to the canvas
  • Cameras and viewports - CameraComponent, World, and parallax scrolling for moving scenes
  • Camera shake, screens - higher-level helpers for screens, overlays, and a range of easing curves via flame_curves
🏛️

Core Architecture

Flame's architecture centers on a FlameGame class that owns the game loop and a tree of components. Each component can have children, update itself on every tick, and render itself every frame. This hierarchical model mirrors Flutter's own widget tree, so the mental model transfers directly.

  • Component - base class with lifecycle hooks (onLoad, onUpdate, onRemove) and an optional render method
  • PositionComponent - adds position, scale, and rotation, the foundation for most game objects
  • SpriteComponent - displays a static image or a frame of a sprite sheet
  • FlameGame - the top-level game object that runs the loop, fires lifecycle events, and adds initial components in onLoad
  • Event bus - flame_events lets components communicate through a shared event stream

Because components are ordinary Dart classes, they can be unit tested without a device. Flame also provides a FlameTester helper and snapshot testing via flame_test so game logic stays verifiable.

📥

Installation

Flame is a standard Dart package, so adding it to an existing Flutter project is a single command:

flutter pub add flame

You only need Flutter installed and a project scaffolded with flutter create. No external native SDK or editor is required, which keeps onboarding simple. Optionally add bridge packages (see the ecosystem section) by name, for example flutter pub add flame_forge2d for physics.

🚀

Getting Started

The smallest Flame game embeds a FlameGame subclass into a Flutter GameWidget. Here is a bare but runnable example:

import 'package:flame/game.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const GameWidget(game: MyGame()));
}

class MyGame extends FlameGame {
  @override
  void update(double dt) {
    super.update(dt);
    // update game state each tick
  }

  @override
  void render(Canvas canvas) {
    super.render(canvas);
    // draw to the canvas each frame
  }
}

From here you add components such as sprites and text, register tap and drag listeners, and enable the collision mixin. The official tutorials walk through a bare game, a Klondike-style card game, a platformer (Ember Quest), and a space shooter, all hosted in the docs.

🔌

Bridge Packages and Ecosystem

Flame stays lean by moving optional capabilities into separate, first-party "bridge" packages under the flame-engine umbrella. This lets each game pull in only what it needs:

Package Capability
flame_audioPlay sound effects and looping background music
flame_forge2dBox2D physics bodies, joints, and constraints
flame_rivePlay Rive vector animations and state machines
flame_lottieRender Lottie (Bodymovin) JSON animations
flame_tiledLoad TMX tile maps from Tiled into components
flame_oxygenA formal entity-component-system (ECS) model on top of Flame
flame_behaviorsNamed behavior extensions for reusable component logic
flame_splash_screenAnimated splash screen shown while the game boots

This modular design is why Flame appears at the top of most "best Flutter game libraries" round-ups: the core stays fast to learn while specialized needs are one pub add away.

Rendering and Performance

Flame renders through Flutter's canvas rather than a custom GPU API. On mobile and desktop this runs on Flutter's Impeller renderer for consistent 60 frames-per-second output, and on web it targets the standard HTML/wasm renderer. The SpriteBatch and texture caching helpers minimize draw calls by batching common sprites.

Because the game loop is driven by FlameGame, the frame dt is passed to every component's update, so per-frame logic stays deterministic across different refresh rates. Assets are preloaded through the Flame.images cache so sprites do not stall the first frame.

For developers, Flame ships a DevTools extension that visualizes the component tree, inspector, and game loop timing, making performance profiling approachable for hobbyist and pro teams alike.

⚖️

Comparison with Alternatives

Flame competes with other 2D engines whose strengths lie in different directions: full editors with visual tooling, browser-native workflows, and cross-framework physics.

CriteriaFlameGodotPhaserUnity
LanguageDartGDScript / C#JavaScript / TypeScriptC#
Visual editorNo, code-first with DevToolsFull 2D/3D editorNo, code-firstFull editor
PlatformsiOS, Android, web, desktopDesktop, mobile, web, consolesWeb-firstVery broad
PhysicsVia flame_forge2dBuilt-in 2D/3D physicsPlugins (Phaser Matter/Arcade)Built-in Physics
Learning curveLow for Flutter devsModerateLow for JS devsSteep
LicensingOpen source (MIT)Open source (MIT)Open source (MIT)Proprietary + revenue share

Flame vs Godot: Godot offers a full visual editor and built-in physics, making it the better choice for teams that want scene composition without writing code. Flame stays lighter and keeps everything in Dart, so a team already fluent in Flutter builds and ships a 2D game faster with Flame than by learning Godot's editor and scripting.

Flame vs Phaser: Phaser is excellent for web-only JavaScript games and enjoys a huge browser ecosystem. Flame wins when you want a single Dart codebase that also ships native mobile and desktop apps, and when you want to reuse Flutter UI widgets inside or around the game canvas.

Flame vs Unity: Unity is a professional-grade engine suited to complex, asset-heavy, and 3D projects with visual level design. Flame is far simpler to adopt for modest 2D games and avoids Unity's licensing and export complexity, but it cannot match Unity's asset store, console pipelines, or 3D authoring tools.

🌍

Community and Resources

Flame is developed in the open by the Blue Fire community under the flame-engine umbrella on GitHub at github.com/flame-engine/flame. The project is maintained by a core team of Flutter developers and supported through donations on OpenCollective.

Learning material is plentiful: the official Flame documentation and tutorials, video series from Tyler Codes and Yayocode, the Kodeco (formerly raywenderlich) guided tutorial, and community sample games in the examples directory. Active discussions happen on the Flame community links and in the Flame Discord server.

A curated list of games, tutorials, and tools built with Flame is maintained in the awesome-flame repository, which is a good starting point to see what the engine can ship in production.