Graphic Shape Shifter
The polygon can be inserted in ten different shapes using a custom stylesheet.
Each shape animates out to a rectangle when the item enters the viewport.
Graphic Design [2]
Shape Shifting
Animated Shapes
The ThemeKit Graphic Design Shape Shifter can insert an image in ten different shapes and animatimate out to a rectangle when the item enters the viewport.
Grid
The two column grid has controls for the relative column widths. It can be switched and the text can be above or below the image below the breakpoint.
Image
The image has alt text and a lazy loading option. The caption is centered at the bottom of the shape and there is an option to add an animated inset box shadow.
Article
The article has a heading, text, styled spans and an optional internal/external link. It has controls to add a border and/or a bottom box shadow.
Diamond
The shapes are created using a custom, minified styjesheet for maximum download efficiency.
Trapezoid 90°
The article element has a headilng, text, stylespans and an optional CTA style link to open internal/external pages.
Link
Circle
The article can have a border and/or a bottom box shadow.
A bottom box shadow is created using zero nad to values for shadow radius and a negative spread equal to half the radius.
In this case the bottom border is removed for a more professional appearance.
Octagon
Shapes like this can't reallyhave a border or box shadow.
Inset
An inset box shadow changes the shadow from an outer shadow (outset) to an inner shadow
Star
The animation can occur every time the item enters the viewport or only once.
The animatio by default is removed for mobile phones but can be tirned on if really necessary.