It is a library for arranging/resizing pixi rendered elements basing on css like configs. It is made for simple and fast implementation of the responsive user interfaces in your games.

We are now a part of the Open Collective and with your support you can help us make PixiJS even better. To make a donation, simply click the button below and we'll love you forever!

Here are some useful resources:


Depending on your version of PixiJS, you'll need to figure out which major version of PixiLayout to use.

PixiJS PixiLayout
v7.x v1.x
v8.x v2.x


npm i @pixi/layout


import { Layout } from "@pixi/layout";

new Layout({
    content: {
        content: Sprite.from("bunny.png"),
        styles: {
            position: "center",
            maxWidth: "100%",
            minHeight: "100%",
    styles: {
        background: "red",
        position: "center",
        width: `100%`,
        height: `100%`,


Want to be part of the PixiUI project? Great! All are welcome! We will get there quicker together :) Whether you find a bug, have a great feature request, or you fancy owning a task from the road map above, feel free to get in touch.

Make sure to read the Contributing Guide before submitting changes.

Also you can check the Controllers influence schemas


This content is released under the (http://opensource.org/licenses/MIT) MIT License.