# createGraphicsDevice

Function · category: Graphics

Source: https://github.com/playcanvas/engine/blob/f059dc005842f76e052cdf44d8370c8c7ec475ac/src/platform/graphics/graphics-device-create.js#L92

```ts
createGraphicsDevice(canvas: HTMLCanvasElement, options?: object): Promise<GraphicsDevice>
```

Creates a graphics device.

**Parameters**

- `canvas` (`HTMLCanvasElement`): The canvas element.
- `options` (`object`, optional, default `{}`): Graphics device options.
    - `options.alpha` (`boolean`, optional): Boolean that indicates whether the canvas composites with
      the page behind it. Defaults to true. This is a compositing option rather than a memory one -
      neither backend has an alpha-less backbuffer format that saves any space. The backends
      implement it differently:

      - [DEVICETYPE_WEBGL2](https://api.playcanvas.com/engine/variables/DEVICETYPE_WEBGL2.md): forwarded as the WebGL `alpha` context attribute, so the browser
      decides whether the drawing buffer actually has an alpha channel. When it does not, the device's
      `backBufferFormat` becomes [PIXELFORMAT_RGB8](https://api.playcanvas.com/engine/variables/PIXELFORMAT_RGB8.md) rather than [PIXELFORMAT_RGBA8](https://api.playcanvas.com/engine/variables/PIXELFORMAT_RGBA8.md), which
      also changes the format of the scene color grab pass.
      - [DEVICETYPE_WEBGPU](https://api.playcanvas.com/engine/variables/DEVICETYPE_WEBGPU.md): selects the canvas alpha mode ('premultiplied' when true, 'opaque'
      when false). The backbuffer always has an alpha channel, so `backBufferFormat` is unaffected and
      'opaque' simply tells the compositor to ignore the alpha that is already there.

      Compositing is premultiplied on both backends, so a transparent canvas needs a camera
      [CameraComponent#clearColor](https://api.playcanvas.com/engine/classes/CameraComponent.md#clearcolor) with both its alpha and its RGB set to zero. A non-zero color
      with zero alpha is not valid premultiplied data and composites inconsistently across browsers.

      Note that this default applies to this function. The legacy [Application](https://api.playcanvas.com/engine/classes/Application.md) constructor
      instead defaults `alpha` to false.
    - `options.antialias` (`boolean`, optional): Boolean that indicates whether or not to perform
      anti-aliasing if possible. Defaults to true.
    - `options.depth` (`boolean`, optional): Boolean that indicates that the drawing buffer is
      requested to have a depth buffer of at least 16 bits. Defaults to true.
    - `options.deviceTypes` (`string[]`, optional): An array of DEVICETYPE_*** constants, defining the
      order in which the devices are attempted to get created. Defaults to an empty array. If the
      specified array does not contain [DEVICETYPE_WEBGL2](https://api.playcanvas.com/engine/variables/DEVICETYPE_WEBGL2.md), it is internally added to its end.
      A [DEVICETYPE_NULL](https://api.playcanvas.com/engine/variables/DEVICETYPE_NULL.md) device, which renders nothing, is only created if it is specified.
      Typically, you'd only specify [DEVICETYPE_WEBGPU](https://api.playcanvas.com/engine/variables/DEVICETYPE_WEBGPU.md), or leave it empty. Use
      [DEVICETYPE_WEBGPU_BARE](https://api.playcanvas.com/engine/variables/DEVICETYPE_WEBGPU_BARE.md) or [DEVICETYPE_WEBGL2_BARE](https://api.playcanvas.com/engine/variables/DEVICETYPE_WEBGL2_BARE.md) to create a device without
      optional features and with the limits of the least capable devices, useful for testing on
      constrained devices.
    - `options.displayFormat` (`string`, optional): The display format of the canvas. Defaults to
      [DISPLAYFORMAT_LDR](https://api.playcanvas.com/engine/variables/DISPLAYFORMAT_LDR.md). Can be:

      - [DISPLAYFORMAT_LDR](https://api.playcanvas.com/engine/variables/DISPLAYFORMAT_LDR.md)
      - [DISPLAYFORMAT_LDR_SRGB](https://api.playcanvas.com/engine/variables/DISPLAYFORMAT_LDR_SRGB.md)
      - [DISPLAYFORMAT_HDR](https://api.playcanvas.com/engine/variables/DISPLAYFORMAT_HDR.md)
    - `options.glslangUrl` (`string`, optional): The URL to the glslang script. Required only if
      user-defined shaders or shader chunk overrides are specified in GLSL and need to be transpiled to
      WGSL for use with the [DEVICETYPE_WEBGPU](https://api.playcanvas.com/engine/variables/DEVICETYPE_WEBGPU.md) device type. This is not required if only the
      engine's built-in shaders are used, as those are provided directly in WGSL. Not used for
      [DEVICETYPE_WEBGL2](https://api.playcanvas.com/engine/variables/DEVICETYPE_WEBGL2.md) device type creation.
    - `options.powerPreference` (`"default" | "high-performance" | "low-power"`, optional): A hint indicating
      what configuration of GPU would be selected. Possible values are:

      - 'default': Let the user agent decide which GPU configuration is most suitable. This is the
      default value.
      - 'high-performance': Prioritizes rendering performance over power consumption.
      - 'low-power': Prioritizes power saving over rendering performance.

      Defaults to 'default'.
    - `options.stencil` (`boolean`, optional): Boolean that indicates that the drawing buffer is
      requested to have a stencil buffer of at least 8 bits. Defaults to true.
    - `options.transientColor` (`boolean`, optional): Boolean that requests the multi-sampled (MSAA)
      color attachment of the back-buffer to be allocated as a transient ("memoryless") attachment,
      allowing tile-based GPUs to keep its contents in on-chip memory and avoid VRAM allocation.
      WebGPU only, and only effective when anti-aliasing (MSAA) is enabled - it has no effect on
      single-sampled color, which is always presented. Ignored on devices without transient attachment
      support. Incompatible with a scene color grab pass (`sceneColorMap`): the attachment must be
      cleared on load and discarded on store. Defaults to false.
    - `options.transientDepth` (`boolean`, optional): Boolean that requests the back-buffer depth
      attachment to be allocated as a transient ("memoryless") attachment (see `transientColor`).
      Applies to both single- and multi-sampled depth. WebGPU only; ignored on devices without
      transient attachment support. Incompatible with a scene depth grab pass (`sceneDepthMap`), a
      depth prepass, or any depth resolve, as the depth cannot be sampled or copied out. Defaults to
      false.
    - `options.twgslUrl` (`string`, optional): An url to twgsl script, required if glslangUrl was specified.
    - `options.xrCompatible` (`boolean`, optional): Boolean that hints to the user agent to use a
      compatible graphics adapter for an immersive XR device. When omitted in a browser, defaults to
      `true` if `navigator.xr` is present, otherwise `false` (see [GraphicsDevice](https://api.playcanvas.com/engine/classes/GraphicsDevice.md) constructor).

**Returns** `Promise<`[`GraphicsDevice`](https://api.playcanvas.com/engine/classes/GraphicsDevice.md)`>`: - Promise object representing the created graphics device.
It is rejected if none of the device types can be created, with an `AggregateError` whose
`errors` contain the error of each device type that failed.