EverWeb Widgets HTML5

Curved & Circular Text

Wrap Text Around An Object  

Curved Text Widget

Reversed Curve Text

icon pad widget

Text Arcs & Circles

Curved text is more a feature of DTP (Desktop Publishing) software than in web design apps but this widget allows curved and circular HTML headings to be inserted in web pages.
The widget has no background so that the text can be inserted around other objects as illustrated by the icon above right.
The amount of curve can be adjusted by varying the value for "Radius".
Entering a value of zero creates a circle.

Widget Settings

Enter the text and choose the heading size.
Enter the font family name, check the box if it is Google hosted and choose a suitable web safe fallback font.
Set the font size, color, style and weight.
Adjust the letter spacing if necessary.
Enter a value for the radius. The larger the value the shallower the curve.
Set the radius to zero to create a circle.
Use the HTML for a non breaking space at the end of the text to create a break between the start and end of the circular text. The HTML is  
Example: The text around the icon at the top right of this page is entered like this...
Wrap Text Around An Object  

Reverse Control
Checking the box will reverse the direction of a curve and turn circular text inside out. This is easier to do than describe!

Get The Widget