Outlines
When the background changes frequently, a high-contrast outline can be used to keep the text readable.
Alternatively, they can be used for artistic purposes.
In Rem's Studio, there are up to three borders, which can be added to each Text component. These colors, the width and the smoothness of the outlines can be animated.
The outlines have depth, so they are sorted automatically.
Keep a padding to the background!
All settings for outlines can be found inside the Outlines section inside the Text component.
Modes
To enable outlines, you need to change the Rendering Mode inside the Text component to either Signed Distance Fields or to Merged Signed Distance Fields. Merged SDFs can give better results, if you work with transparent edges, but also require more computational resources, as letters cannot be reused in the text at a later point in time.
Colors
There are at maximum three outline colors, which can be set. The default value for the first color is opaque black, while the others are transparent black. The properties are called Color 1-3.
If you need more than three outlines, you can stack text elements, and change the width, so they perfectly complement each other.
Width
The widths of each line can be changed inside the Widths property. The base colors width is the first value, then the three colored outlines follow.
Rounded Corners
Under Rounded Corners you can select, whether the corners should be rounded. For soft shadows, rounded looks better. For other styles, non-rounded corners may look better.
The blue border has non-rounded corners, and the pink one has rounded corners.
Increase the resolution
You can increase the resolution in the Config/Settings under the key Rendering/Signed Distance Fields/Resolution. Increasing the resolution will increase the processing time! The default value is 5.
Maximum Width
You can increase the max width in the Config/Settings under the key Rendering/Signed Distance Fields/Padding. Increasing the width will result in longer processing times! The default value is 10.
Created: 16:05, 21. Dec 2020; Most recent change: 16:30, 21. Dec 2020