Setting other CSS properties

You can set most other CSS properties on a Text Layer (or any other layer), but you’ll have to add them to the style property.

(You can type most of them in camelCase; here’s a page on MDN with an overview.)

In this example, I gave the layer a gradient background (by setting background instead of backgroundColor) and then used a webkit-specific property to clip (mask) that background with the text.

# Linear gradient: shades of gray
textLayerA.style =
    background: "linear-gradient(#eee, #333)"
    webkitBackgroundClip: "text"

For this to work we also have to remove the color of the text by setting it to "transparent" or null:

textLayerA.color = null

The other three examples are the same, only with different gradient settings.

# Linear gradient: starts at 30% of the height and stops at 90%
background: "linear-gradient(rgb(98,125,77) 30%, rgb(31,59,8) 90%)"
# Linear gradient: all the colors!
background: "linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet)"
# Radial gradient: from yellow in top right corner to orange
background: "radial-gradient(circle at top right, yellow, #f06d06)"