Ellipse

Ellipse

The Ellipse in Incari provides similar functionality as its equivalent in Figma.

There are several Attributes which allow the user heightened customizability and control.

Attributes

Transformation

The Transformation Attributes deal with placement, rotation, and size in XY space. More information can be found here.

Blending

This Attribute lets the user set a Blend Mode as a base property of the Ellipse. These are established on common formulas, examples of each can be accessed here. An Object's Blend Mode can also be set with the Set Blend Mode Node.

Fill

The Fill Attributes consist of different items called Elements. Each Element contains a Type. This can be either Solid or Image and changes some of the available Attributes under this category.

If there is more than one Fill Element, the most recent one will take precedent over the others (unless some Blend Mode is applied).

Solid

When Solid is selected, Color is visible.

  • Color is a color selector that lets the user pick the Fill's color.

  • Similar to the base property described previously, Blend Mode here affects the Fill Elements only. These are established on common formulas, examples of each can be accessed here. It can also be set with the Set Blend Mode Node.

  • Opacity refers to how opaque or transparent the Fill appears. This is represented by an integer between 0 and 1.

Image

When Image is selected, Image and Fit Mode are visible.

  • Image is the desired Texture file.

  • Fit Mode determines how the Texture is displayed. These can be Fill, Fit, Crop, and Tile. Tile has the additional Attribute of Scale Factor, which augments the tesselation.

  • Similar to the base property described previously, Blend Mode here affects the Fill Elements only. These are established on common formulas, examples of each can be accessed here. It can also be set with the Set Blend Mode Node.

  • Opacity refers to how opaque or transparent the Fill appears. This is represented by an integer between 0 and 1.

Stroke

The Stroke Attributes consist of different items called Elements. Each Element contains a Type. This can be either Solid or Image and changes some of the available Attributes under this category. There are also two fixed Attributes outside of the Elements. These are:

  • Width, which is how wide (in pixels) each Stroke will appear. This applies to each Stroke Element.

  • Position, which determines what part of the outline identifies the outside of the Object. For example, if Inner is selected, then the outside of the Stroke is the outside of the Object. If Center is selected, then the Stroke's center is the outside of the Object. If Outer is selected, then the inside of the Stroke is the outside of the Object.

Solid

When Solid is selected, Color is visible.

  • Color is a color selector that lets the user pick the Stroke's color.

  • Similar to the base property described previously, Blend Mode here affects the Stroke Elements only. These are established on common formulas, examples of each can be accessed here. It can also be set with the Set Blend Mode Node.

  • Opacity refers to how opaque or transparent the Stroke appears. This is represented by an integer between 0 and 1.

Image

When Image is selected, Image and Fit Mode are visible.

  • Image is the desired Texture file.

  • Fit Mode determines how the Texture is displayed. These can be Fill, Fit, Crop, and Tile. Tile has the additional Attribute of Scale Factor, which augments the tesselation.

  • Similar to the base property described previously, Blend Mode here affects the Stroke Elements only. These are established on common formulas, examples of each can be accessed here. It can also be set with the Set Blend Mode Node.

  • Opacity refers to how opaque or transparent the Fill appears. This is represented by an integer between 0 and 1.

Ellipse

These Attributes give the foundation properties of the Ellipse Object.

  • Arc Sector determines the percentage of the Ellipse visible. For example, if it is set to 100, the entire Ellipse shows and if it is set to 50, only half shows.

  • Thickness ranges from 0 to 100. If it is set to 0, there is no white space in the center of the Ellipse at all. If set to 100, the entire Ellipse is replaced by white space. If set to 50, part of the center is white space, creating a 'donut-like' shape.

  • Start Angle ranges from 0 to 360 and determines at which angle the start of the Ellipse begins. If Arc Sector is set to 100, this will have not have any visual impact.

Mask

A Mask is an Object that shows a certain area of another Object while concealing the rest. Any Object (e.g., an Ellipse, Rectangle, Frame, Group, or Text) can be used as a Mask.

For easier visualization, think of the Mask as a cookie cutter while the masked Object is the dough: the cookie cutter shows only a part and discards the rest.

The Type Attribute has three options:

  • None - nothing is applied.

  • Alpha - the Mask has an opacity level (alpha channel) determining with which level of opacity (or transparency) the masked Object is revealed: 0% opacity reveals nothing, 100% opacity is equivalent to a Mask with Vector type.

  • Vector - only modifies the shape outline of the masked Object

  • Luminance - allows the user to utilize brightness to determine the effect of the Mask; the brighter the area of a Mask, the more that is revealed and the darker the area, the less that is revealed.

Object allows the user to select what should be the masked Object.

Apply Mask is a toggle that applies the Mask when set to on, and disables the Mask when set to off.

Tag

This Attribute manages the tags for the Button. See more on tags here.

Last updated