Shape - Web Component

The Shape component can be used imported from:

Playground

The Web component uses the <z-shape> tag:

By default, all the parameters are optional or can be set in different, except for the ones marked as required

The parametrization of the component can be done with the following custom HTML params:

Name Type Description Slot A11y

Name	Type	Description	Slot	A11y
`shape`	`string`	The main parameter has two components following the pattern: `<shape><?:flip>` where: `shape`: Value of the shape to display. Possible values are `1`, `2`, `3`, `4`, `5`, `6`, `7` `flip`: Optional parameter to flip the shape.

string

The main parameter has two components following the pattern: <shape><?:flip> where:

shape: Value of the shape to display. Possible values are 1, 2, 3, 4, 5, 6, 7
flip: Optional parameter to flip the shape.

The shapeis used to define the shape to display. Possible values are 1, 2, 3, 4, 5, 6, 7.

All this shapes can be flipped by adding the flip parameter. The pattern is <shape><?:flip>

The size of the shape can be customized using the --z-shape--size CSS custom property.