Load Curved Box Above in WebApp
Load the WebApp         

Application Tips

 This program allows you to 'skin' your web Content/HTML with a Curved Corner Box. After 'skinning', your 'active' HTML like web forms and videos will still remain 'active'.  You enter your web Content/HTML, like a YouTube.com 'embed' tag, into a large textbox in this program labeled: 'Your Box Contents (HTML OK)'.

 Once you have inserted your Contents/HTML into this program, you can begin to interactively design the look of your Curved Corners Box 'skin' and the style of the text within it like font family, font color, and font size. No knowledge of HTML is required for this. You can change the 'skin' to any color you want, or you can use one of my graphics for your 'skin'. You can even use any graphic you have as the 'skin' and my system will create curved corners out of it. You have point and click control to change the font family, font size, font color, line height, and attributes like bold and italics. Many examples of different styles of Curved Corner Boxes that can be created with this system are found further on down in this column.

This system features automated functions to create the HTML code for you for standard items you might want to include in your 'Contents Area' like web links, web graphics, and horizontal rules. You can also style a subpart of your 'Contents Area' differently, like with a different font family and font color, or a different background color. No knowledge of HTML is necessary to use any of these functions.

Now that you have all your Contents/HTML in your Curved Corner Box and you have finished designing the style of your box, all that is left to do is to select the 'Show COPY/PASTE Code' function! That will take you to a page where you COPY the code from a textbox to your clipboard and then PASTE it into your web page or MySpace.com account. Bam, Curved Corners Box with your included 'live' Contents/HTML is now on your web site or MySpace.com account!

This application contains a lot of context sensitive help buttons that look like this: question mark. When you click on one of those question marks, the application manual will be launched in a popup window, and the section of the manual pertaining to the item that the question mark was located next to will be displayed.

Below are some examples of different styles of Curved Corner Boxes you can make

The rest of this column contains some examples of Curved Corner Boxes you can create with this system. All of the Curved Corner Boxes below were in fact created with this system by me and then just Copied/Pasted into this web page at the point where they display!

Make the Curved Corners Box 'skin' any color you want, or just use the classic 'ghost skin' with the interior of the box set to white so that only the curved 'outline' shows.  

cc
b   A conserative, neutral, gray interior. Goes with almost any existing web page style.   b
cCurved Corner Boxes
 
cc
b   'Ghost' Curved Corner Box 'skin' created with this system. I could have also added links, image tags, video embed tags, whole html forms, or even script tags in here! Or even any mixed/matched combination of the above!   b
cCurved Corner Boxes

 If you like, you can set the background color of the 'Contents Area' in the interior of the box, to a different color than the Curved Corner Box Body.  You can also control things like interior padding and whether to display a border around that area and its style.

cc
b   The outside Curved Corners Box body can be any color you want and the background color of the interior can be any color you want. You can also control whether to display a border around the interior area and it's color and size.   b
cCurved Corner Boxes

 In addition to setting different colors for your Curved Corner Box body and the interior background, you can also use graphics!  You can use one of the graphics provided by this system by using the Graphics Picker, or you can enter in an arbitrary url of any graphic on the web.  Some options allowed by my Graphics Picker are various woods, wood logs, stones, bricks, and some lines (reptiles coming soon).

cc
b   I'm using a Birch graphic picked using this systems Graphics Picker for the body of this box! This box can still contain 'live' HTML items like links, forms, and even 'embed' tags like YouTube.com Videos!
 
I could also have made the background of this area in here a tiling graphic instead of the solid white color.  It could even be a different graphic than the body graphic.
   b
cCurved Corner Boxes
 
cc
b   In this one, I'm letting the Curved Corners Box body graphic 'flow' into the background of the interior 'Contents Area'. Most graphics are too busy and make text hard to read so the style above with the white interior is easier to make work than this style.   b
cCurved Corner Boxes
 

You can enter the URL of any arbitrary graphic on the web into the 'Box Body graphic URL' field (please do not remote link to other peoples graphics) and this system will create Curved Corners out of it.

cc
b   For this Curved Corners Box body, I downloaded a free graphic from grsites.com, uploaded it to my website, and then entered the entire url of the graphic into the 'Box Body graphic URL' field.
 
I then clicked somewhere outside that field and this system creates Curved Corners out of a non curved cornered graphic! The graphic started with looks like this:
wood grain
 
To do this:
1) Find some free graphics on the web that would possibly make a good Curved Corner Box body
2) Download that graphic to your computer
3) Upload it to some free graphics service on the web or some web site you have access to
4) Enter the fully qualified url in the 'Box Body graphic URL' field of this program. A fully qualified url starts with 'http://'.
5) Click anywhere outside the field to start the auto update of the floating WYSIWYG box with your graphic!
 
Some ideas for good Curved Corner Box body graphics: wood, stone, tiles, brick, lines, reptile, bark, metal, and animal.
  b
cCurved Corner Boxes

 As well as controlling your Box body style with just point and click ease, you can also control the text style of the inner 'Contents Area' the same way.

cc
b   I used the controls below the 'Your Box Contents' textbox on the main application page to change the font style of this text:
 
1) I changed the font color using the 'Color Picker' link to the right of the 'Font Color:' field.
2) I changed the font family to Verdana using the drop down selection control.
3) I changed the font size to 18 pixels using the 'Text size:' fields.
4) I changed the line height to 135% by using the 'Line height:' fields.
5) I checked the 'Italics?' checkbox to make this text italics.
  b
cCurved Corner Boxes

 This program also offers 4 different functions to automate the process of creating HTML code for you for subparts of the 'Contents Area'.  These functions are located just to the right of the 'Your Box Contents' textbox and offer the functions: 'Create Web Link', 'Insert Image Tag', 'Style SubSelection', and 'Insert Horizontal Rule'.

cc
b   In this box I have used the 'SubSelection' functions located next to the 'Your Box Contents' textbox to automaticaly create HTML items like links, images, horizontal rules, and different font styles and background styles for only part of the box:
 
1) I created this link to YouTube by selecting the text 'YouTube' located in this box contents and clicking on 'Create Web Link'. I pasted in the url to YouTube in the text box provided and changed the font size of the link to '130%' as well!
 
2) I inserted an image tag going to my own help button used on this website using the 'Insert Image Tag' subSelection function:
It\'s my help button
3) I made the background of this area 'white', added a border, tweeked the inner padding, and changed the font family, size and color. All was done using the 'Style SubSelection' function and no HTML had to be written by me!
4) You can make horizontal rules too and control their thickness, width, color, and border size and color:
b
  b
cCurved Corner Boxes

 Amazingly, you can experiment with most of the features of this system without even signing up!  You wouldn't be able to see the COPY/PASTE code to paste into your web page or blog, and you wouldn't be able to save your own CUSTOM STYLES for repeat use as a signed up user can, but you can experiment with most of the rest of the system and see what neat Curved Corner Boxes you can come up with.  Signup is FREE at this time to use the full features of the system and does not require a credit card #, only a valid email address.  Signup can done at any time from a link on the application page.

Run the Application
 
 
 

 
 

This web page Validates!
Valid HTML 4.01 Transitional    Valid CSS!