Group items tagged

The following demo was made using a variety of CSS techniques. Rounded corners, shadows, gradients, rgba, pseudo-elements, and transforms are just some of them. A lot of these were generated by helpful tools, such as westciv's tools and Border Radius. By combining these techniques, you can create rich graphics with just a few lines of code. Here are a few examples. In the contacts icon, I used 5 different shapes for the silhouette icon. The head is a rectangle with rounded corners, followed by another rectangle for the neck and a distorted semi-circle for the body. In order to get the curve of the shoulders to the neck, I placed two circles on top of the shapes. The weather icon has several rays of light shooting from behind the sun. Each one of these rays is actually a long rectangle with a gradient that fades to transparent on either end. I used -webkit-transform:rotate to rotate each rectangle to a different angle. The same effect was used for the iTunes icon. To get the cloud icon on the iDisk icon, I used two circles layered on top of each other, above a rounded rectangle. The larger circle has a gradient that cuts off just before the rectangle.

and no images

Spiffy Corners is a simple way to generate the CSS and HTML you need to create anti-aliased corners without using images or javascript.

Generate HTML/CSS code and images for rounded corners.

Take a walk through the woods and learn about all things HTML5. Starting with the JS APIS (selector API, storage, appcache, web workers, web sockets, notifications, drag and drop, and geolocation). Then delve into the new HTML semantic tags, link relations, micro data, ARIA, forms, audio and video, Canvas, and WebGL. Finally, the holy trinity finishes with CSS and selectors, fonts, text, columns, stroking, opacity, HSL, rounded corners, gradients, shadows, backgrounds, transitions, transforms, and animations.

Galeria de arte, sexualidade e corporalidade, incluindo artigos, poemas, contos, galerias, imagens, telas de Géssica Hellmann, letras de músicas sensuais.

Did you like my previous CSS tutorial on how to create gradient text effects? I'm using the same trick to show you how to decorate your images and photo galleries without editing the source images. The trick is very simple. All you need is an extra tag and apply a background image to create the overlaying effect. It is very easy and flexible - see my demos with over 20 styles, from a simple image icon to a rounded corner to a masked layer (both decorative and complex).

Trick to show how to decorate your images and photo galleries without editing the source images.