About UI Toolkit Gradients for Text & Soft Text Masks
- Tools, Systems & Learning > Development Tools & Automation
This asset is NOT for uGUI. It is for the new UI Toolkit and Unity 6.3+.
But does not Unity already have a gradient tag? Why this asset?
Yes, if all you need is per character gradients then the gradient tag is the tool for you and you should not get this asset.
Here is the full feature list:
Blend Modes
Use blend modes for colors and alpha to effectively create soft mask for your text.
One gradient across all text in any text element
Three gradient modes (element, text, character) with radial gradients and angle control for linear gradients.
No richText required
Works for text that has the enableRichText option disabled too.
Color Blending & Alpha Masking
Gradients can blend with the underlying text colors. Useful to emulate lighting and other effects like alpha masking.
Works with UI Builder, USS Style Sheets and C# Code
Whatever your preferred workflow is this tool has you covered.
Gradients are saved in your UXML
All the data is right there in your UXML file ready to be shared, copied. No need to manage separate gradient assets.
No custom element needed (it uses Manipulators)
You can add it easily to any of your existing visual elements, no custom element required.
Undo/Redo Support
Full undo and redo support in case you want to revert your changes.
UPM Package
It's all conveniently placed in a upm package so it stays out of your Assets folder.
Examples
Check out the Samples in the Unity Package Manager to get demos like the mouse following radial gradient.
Full Source Code included
I publish this asset with full source code because as a developer I know how annoying it is to not have source code access.
Supports Unity 6.3+ LTS
It should work on any platform that supports UI Toolkit. Yes, it works with WebGL.
Caveats: The colors that can be displayed are limited by the four corners (vertices) per character. Thus three or more colors in a gradient ON ONE CHARACTER will probably not look as you expect (middle colors look washed out). This is a limitation by how Unity renders the text mesh and can not be avoided. Usually it's not noticeable but if you do very big characters or many colors in a gradient then you may run into this.
Underlines can not be colorized (not supported by Unitys API) thus they will always show in the text color of the element.
But does not Unity already have a gradient tag? Why this asset?
Yes, if all you need is per character gradients then the gradient tag is the tool for you and you should not get this asset.
Here is the full feature list:
Blend Modes
Use blend modes for colors and alpha to effectively create soft mask for your text.
One gradient across all text in any text element
Three gradient modes (element, text, character) with radial gradients and angle control for linear gradients.
No richText required
Works for text that has the enableRichText option disabled too.
Color Blending & Alpha Masking
Gradients can blend with the underlying text colors. Useful to emulate lighting and other effects like alpha masking.
Works with UI Builder, USS Style Sheets and C# Code
Whatever your preferred workflow is this tool has you covered.
Gradients are saved in your UXML
All the data is right there in your UXML file ready to be shared, copied. No need to manage separate gradient assets.
No custom element needed (it uses Manipulators)
You can add it easily to any of your existing visual elements, no custom element required.
Undo/Redo Support
Full undo and redo support in case you want to revert your changes.
UPM Package
It's all conveniently placed in a upm package so it stays out of your Assets folder.
Examples
Check out the Samples in the Unity Package Manager to get demos like the mouse following radial gradient.
Full Source Code included
I publish this asset with full source code because as a developer I know how annoying it is to not have source code access.
Supports Unity 6.3+ LTS
It should work on any platform that supports UI Toolkit. Yes, it works with WebGL.
Caveats: The colors that can be displayed are limited by the four corners (vertices) per character. Thus three or more colors in a gradient ON ONE CHARACTER will probably not look as you expect (middle colors look washed out). This is a limitation by how Unity renders the text mesh and can not be avoided. Usually it's not noticeable but if you do very big characters or many colors in a gradient then you may run into this.
Underlines can not be colorized (not supported by Unitys API) thus they will always show in the text color of the element.