# Additional features

> There are some additional features that you may already discovered about the renderer core engine.

> ## Graphic features

> I have always wanted the W3C to add this features to the CSS spec (and so far, not there yet :)

> - Gradients on backgrounds
> - Rounded corners

> And I think many many web designers would agree. Is it so hard or what?.

> ### Background Gradients

> It is a simple two color linear gradient, achieved by the adding of two CSS properties:

> 1. `background-gradient: (#Color)` - Second color of the gradient background, the first one is given by `background-color`. Not inherited.
> 2. `background-gradient-angle: (number)` - Angle (in degrees, clockwise) of the gradient. Not inherited. Initial value:90
> Some examples

> 0 degrees | 45 degrees | 90 degrees | 135 degrees | 180 degrees

> ### Rounded corners

> As you may already know, CSS is based on a Box Model, where every box has it's own set of properties. Since we are talking abound boxes, why not to make them with rounded corners, almost every website you visit nowadays makes use of rounded corners, where a not very nice trick with images and tables must be used.

> In this renderer, the rounded corners are achieved by adding this CSS properties:

> - `corner-ne-radius: (length)` Indicates the radius of the north-east corner. Not ineritted
> - `corner-se-radius: (length)` Indicates the radius of the south-east corner. Not ineritted
> - `corner-sw-radius: (length)` Indicates the radius of the south-west corner. Not ineritted
> - `corner-nw-radius: (length)` Indicates the radius of the north-west corner. Not ineritted
> - `corner-radius: (length){1,4}` Shorthand for the other corner properties. Not ineritted
> Some examples

> | c1 | c2 | c3 | c4 | c5

>     .c1, .c2, .c3, .c4, .c5 { background-color:olive; border:0px; color:white; vertical-align:middle; }
>     .c1  { corner-radius: 0px }
>     .c2  { corner-radius: 10px }
>     .c3  { corner-radius: 0px 10px 10px 0px }
>     .c4  { corner-radius: 18px }
>     .c5  { corner-radius: 10px; border: outset #bb0 2px; }