The colour editor and colour picker

A colour row holds one colour or a gradient. The colour picker sets one colour. The colour editor draws a gradient, a run of colours with a marker for each. Exercise 4 uses both for the first time. This page lists everything they can do.

What it makes possible:

• A fire gradient. Four markers: white, yellow, orange, dark red.
• A blend from red to blue that stays vivid in the middle. Press Hues.
• A gradient turned end for end, with no marker moved by hand. Press Invert.
• A gradient taken from a script, or handed to one. Press Code.

On most rows a gradient runs over the particle’s life, from the left end at the start to the right end at the finish. In a Blender state it runs along the beam, from one Attachment to the other.

The colour row

A colour row in the Properties panel has three parts.

Part of the row	Action	Result
Swatch	Click	The colour picker opens. The colour picked is written to every selected emitter as one flat colour.
Box	Enter three numbers, R, G, B, each from 0 to 255	The row holds that one colour.
⋯	Press	The colour editor opens beside the row.
⋯	Hold Shift and click	A small menu opens: Copy graph, Paste graph, Reset default.

The swatch shows the colour, or the gradient. The box reads <ColorSequence> while the row holds a gradient. Fewer than three numbers in the box are refused.

CAUTION

Picking a colour from the swatch, or entering three numbers in the box, replaces a gradient with one flat colour. To change a gradient, press ⋯.

The colour editor

The title reads Color - Color on a Color row. The second word is the name of the row. The editor can be dragged by its header. Its size is fixed.

Place	Control	What it does
Header	Code	Shows the gradient as Roblox code, and reads code back in.
Header	Copy, Paste	Copy the whole gradient, or paste the last one copied.
Header	X	Closes the editor without keeping the result.
Bar	The gradient bar	Shows the gradient from start to end.
Bar	Markers	Triangles under the bar, one for each colour of the gradient.
Info row	Time:	The place of the selected marker, from 0 at the left end to 1 at the right end.
Info row	Delete	Removes the selected marker.
Footer	Invert	Turns the gradient end for end.
Footer	Hues	Adds markers so that a blend between two distant hues stays vivid.
Footer	Reload	Returns the gradient to what it was when the editor opened. The editor stays open.
Footer	Cancel	Closes the editor. Each emitter gets its own gradient back.
Footer	Apply	Writes the gradient to every selected emitter and closes the editor.

Every change shows on the selected emitters as it is made. Nothing is kept until Apply is pressed. Apply makes one step in Studio’s undo history.

Markers

To	Do this
Add a marker	Click the bar, or the strip under it. A faint triangle follows the cursor and shows where the marker will go.
Select a marker	Click it. It turns bright.
Change a marker’s colour	Click the marker that is already selected. The colour picker opens, titled Stop Color.
Move a marker	Drag it.
Move a marker by number	Click a middle marker, then enter Time:, from 0 to 1.
Delete a marker	Click a middle marker, then press Delete.

A new marker takes the colour the gradient had at that place.

NOTE

The first and last markers stay at the two ends. They cannot be moved and cannot be deleted. Their colours can be changed.

A gradient has at least 2 markers and at most 20. The limit of 20 is Roblox’s.

Invert and Hues

Invert reverses the gradient end for end. The first colour becomes the last. This differs from Invert in the graph editor, which flips a graph upside down.

Hues repairs a blend that turns dull in the middle. A straight blend between two distant hues, such as red and blue, passes through a greyish colour. Hues adds markers between the two, and the blend then travels round the colour wheel.

Hues adds nothing between two greys, or between two hues that are close. It never takes a gradient past 20 markers.

Code

Code opens a box that holds the gradient as Roblox code, a ColorSequence, already selected. Press Ctrl+C to copy the code into a script. The code has this form:

ColorSequence.new({ ColorSequenceKeypoint.new(0, Color3.fromRGB(255, 240, 170)), ColorSequenceKeypoint.new(1, Color3.fromRGB(120, 20, 0)) })

To bring a gradient in from a script, paste the code into the box and press Import. Press Close to leave the box.

The code may write its colours with Color3.fromRGB, Color3.new or Color3.fromHSV. It needs at least 2 entries.

A problem with the code shows in the hint line of the box:

Hint line	Meaning
Need at least 2 keypoints	The code holds fewer than 2 entries.
Unreadable keypoint	An entry could not be read.
Unsupported Color3 constructor: and a name	A colour is written in a way other than the three above.

Copy and paste

Two pairs of controls share one copy:

• Copy and Paste in the header of the colour editor.
• Copy graph and Paste graph in the menu that Shift and ⋯ opens, on colour rows and graph rows alike.

The copy holds one graph or one gradient at a time. A gradient pastes only onto a colour row. A graph pastes only onto a graph row.

CAUTION

This copy is forgotten when the selection changes. It carries a gradient from one row to another on the same selected emitters, and no further.

To carry	Use
A gradient to another emitter	Clipboard, or Code.
A graph to another emitter	Copy and Paste in the graph editor. That copy survives a change of selection.

Reset default, in the same menu, puts the row back to the plugin’s starting value for that emitter type. On a stock ParticleEmitter it does nothing.

The colour picker

The colour picker sets one colour. It opens from the swatch of a colour row, from a marker in the colour editor, and from the Theme Editor. It can be dragged by its header.

Control	Kind	Range	What it does
Large square	Colour area		Left to right sets the hue. Up and down sets the saturation: vivid at the top, white at the bottom.
Side strip	Colour area		Sets the brightness: bright at the top, black at the bottom.
Preview swatch	Swatch		Shows the colour picked.
Hue	Box	0 to 360	The hue.
Sat	Box	0 to 255	The saturation.
Val	Box	0 to 255	The brightness.
Red, Green, Blue	Boxes	0 to 255	The colour as three numbers.
Hex	Box		The colour as a hex code.
OK	Button		Keeps the colour and closes the picker.
Cancel, X	Buttons		Close the picker and bring back the colour from before it opened.

The colour shows on the selected emitters while it is being picked. Opened from the swatch, OK makes one step in Studio’s undo history, and Cancel gives each emitter its own colour back.

Limits

• At most 20 markers, at least 2.
• The colour editor has no keyboard shortcuts.
• The colour editor cannot be resized.
• The shared copy does not survive a change of selection.