Intro to Beams

5 min

A Beam is a type of special effect object that renders a texture between two Attachment objects. You can configure beam properties like color, transparency, width, texture and texture speed.

Creating a Beam

The beginning and end points of the beam each need to be attached to a part. Before you begin creating the beam, make sure Attachments are visible by enabling Model > Constraints > Constraint Details. If it’s enabled, it’ll be highlighted grey.

Create two parts to act as the start and end of the beam.
Group the parts into a Model (select parts and press Ctrl+G or ⌘+G).
Use the + button to insert attachments into each part.
→
Insert a Beam into the model.
Select the Beam, and scroll down to Attachment0/Attachment1 properties in the Properties window. Set the attachments by clicking on the property, then clicking on the attachments created earlier. Be careful not to assign each attachment properties to the same Attachment!
The end result should look like this:

Moving a Part or its Attachment will also move the Beam, because the attachment points determine the start/end of the beam. You’re ready to start experimenting with beam properties! You can duplicate the Model by selecting it and pressing Ctrl+D or ⌘+D. When making beams, make a copy frequently so you can compare your changes.

Visual Properties

Perhaps the most useful Beam property is Beam/Texture|Texture, which renders a Texture along the length of the beam. Below, a green/pink triangle texture is rendered. The Texture property is a articles/Content property, such as rbxassetid://3259097211 (pictured below).

A green/pink triangle texture pictured next to a plain Beam and a Beam with the texture applied

Color and Transparency using Sequences

Two visual properties of Beams can be specified over the length of the beam using sequences: Transparency and Color. In Studio, you can configure these properties by clicking […] in the Properties window. The Transparency property is a datatype/NumberSequence which is edited using a line graph. The X axis is the position along the beam’s length, and the Y axis is the transparency at that position. Click anywhere on the graph to add another keypoint. Drag existing keypoints to edit or delete them. The Reset button will change the sequence back to what it was when the window was opened.

The Beam transparency sequence, showing a beam going from 0 to 1 Transparency

Beam/Color works similarly, but instead uses color stops along a gradient. The texture is colorizedd along the length of the beam in the same manner as ImageLabel/ImageColor3. Click the sequence bar to add more stops, or the color stops to select them. From there, you can change their color value, position or delete them.

A Beam colorized from red to blue using a color gradient

Beam Geometry

Everything rendered in 3D uses triangles; beams render their textures using two triangles drawn between segment pairs. The segments are laid out between the two Attachment points’ orientation, and twist if the attachments are oriented in different directions. By default, 10 segments are used, but this can be changed by configuring the Beam/Segments|Segments property.

Two beams with 5 segments, wherein the foreground beam twists due to the orientation of the attachments

The above screenshot shows two beams with 5 segments each. The green/pink triangle texture is rendered 4 times between the 5 segments. The foreground Beam’s attachments are twisted slightly to show how the beam will twist as well.

FaceCamera

Beams can automatically angle themselves to face the camera when the Beam/FaceCamera|FaceCamera property is enabled.

Two Beams wherein the background beam is facing the camera

Width0 and Width1

You can set the width of the beam at each endpoint by configuring the Beam/Width0|Width0/Beam/Width1|Width1 properties.

A Beam with different widths at each endpoint

CurveSize0 and CurveSize1

Beams can also curve up or down relative to the attachments’ orientations using the Beam/CurveSize0|CurveSize0/Beam/CurveSize1|CurveSize1 properties.

A big beautiful Beam with curves

Beam Examples

Some extra beam examples are included. Each example is on the Toolbox so it can be added into any place you’re building. Some highlighted properties are noted.

Waterfall

The waterfall makes use of a repeating water texture and the CurveSize properties to create a curved beam. Additionally, having a higher segment count makes the beam curve more smoothly.

Property	Value
Texture	rbxassetid://1190623231
CurveSize0	30
CurveSize1	-5
Segments	36

GET

Forcefield

The force field below uses color gradients to fade from blue to green and a transparency sequence to fade out over time.

Color
Texture	rbxassetid://6073438558
Transparency

GET