CSS Arrow Please - 10 views
-
There are web-based generators for almost everything; stripes, buttons, forms, loader icons, etc. CSS Arrow Please focuses on another niche; yes, totally CSS-based (no images) arrows. This CSS trick is great for using in tooltips, the generator offers multiple options for customization (the position, color and border values) and auto-creates the related CSS code.
extractCSS - Online CSS Extractor - 0 views
Blog | Graphicpeel - iOS Icons Made in Pure CSS - 5 views
-
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.
CSS Corners, CSS3 Gradient - 8 views
Understanding border-image | CSS-Tricks - 6 views
-
Strangely, the percentages require the “%”, while pixels should be listed without the “px”:
BonBon Buttons - Sweet CSS3 buttons - 10 views
Amaya Binary Releases - 0 views
Buttonator - 0 views
Mozilla Developer Web Tech Blog - 1 views
-
Keeping track of Mozilla development is never easy, especially the minute details related to new or improved web technology development and support. The Mozilla development community has set up a new weblog to fix this, the Web Tech weblog. Here the devs will be posting about and discussing topics of interest to web developers.