Docs

Properties

Properties are written name: value. The parser accepts any identifier as a property name, but only the properties in the generated reference have known runtime or renderer behavior.

Transforms

position, rotation, scale, and anchor place and orient an instance. The pipeline is 2D-first: a scalar rotation is a z rotation, and 3-component transforms are accepted for compatibility and layering.

position and size also accept percentages of the nearest ancestor's local size (position: (50%, 50%), size: (25%, 25%)). See values.

imagine card
  shape: rectangle
  position: (10%, 20%)
  size: (50%, 50%)
  rotation: 12
  scale: (1.2, 0.9)
  anchor: (0, 0)

create card

Shapes

Renderer-backed shapes are rectangle, ellipse, circle, star, line, and path. circle is an alias of ellipse; points is an alias for numeric starPoints on stars and array pathPoints on paths.

imagine star
  shape: star
  size: (120, 120)
  starPoints: 5
  ratio: 0.45
  fill: "#ff6b35"
  stroke: "#ffffff"
  strokeWidth: 2

create star

Text

Adding a text property turns an instance into text. Style it with fill, fontFamily, fontSize, fontWeight, fontStyle, textAlign, and verticalAlign. font, color, align, and baseline are not active text aliases.

imagine title
  text: "LumiDSL"
  fontFamily: "Arial"
  fontSize: 64
  fontWeight: "bold"
  fill: "#ffffff"
  textAlign: "center"
  verticalAlign: "middle"

create title

Text accepts stroke and strokeWidth syntactically, but the current text renderer doesn't draw text strokes.

Image Fills

fill accepts an image as well as a color. A bare asset path is treated as an image fill that defaults to cover. For full control, list the options as an indented block under fill:

define photo: "assets/photo.png"

imagine card
  shape: rectangle
  size: (400, 300)
  fill:
    source: photo
    fit: "cover"
    position: (0.5, 0.5)
    repeat: "no-repeat"
    crop: (0, 0, 1, 1)

create card
  • source: the image asset path, or a define that references one.
  • fit: how the image maps onto the shape: cover (fills, crops the overflow; the default), contain (whole image visible, letterboxed), stretch (distorts to fill), or none (natural pixel size, clipped).
  • position: where the image sits within the shape, as fractions of the remaining space; (0.5, 0.5) centers it.
  • repeat: how the fitted crop tiles: no-repeat (default), repeat, repeat-x, or repeat-y.
  • crop: the region of the source image used by the fill, as fractions (x, y, width, height) from the image's top-left; (0, 0, 1, 1) is the whole image.

In the Lumiere Editor, the fill picker exposes the image source, fit, repeat, and a crop editor (drag the crop frame on the preview). Editor restrictions: image fills are offered on shapes; text is limited to solid colors, and stroke / background are color-only. The DSL retains an image fill authored on text, but the text renderer ignores it.

Compatibility Properties

maskMode, maskInvert, and object blendMode are retained as generic properties but don't currently implement masking or blending. See compatibility for their exact status.

For defaults, contexts, and every documented property, read the generated property reference.