Skip to main content

CSS3.0 Maker – Get CSS Code For Border, Box Shadow Effects & More


We’ve reviewed a couple of CSS code generators before like Layer Styles and the ThemeShock CSS Drop Shadow Generator. Both are excellent but limited since they generate code for a single effect only. CSS3.0 Maker is a an auto CSS code generator that generates code for border, text shadow, box shadow, outline effects and skew, scale or rotate an element. You can work on multiple CSS files (different styles in each file) by creating different files. Code is downloaded as an HTML file and CSS is added as an internal sheet. The service tells you what version of Chrome, Firefox, Internet Explorer, Safari and Opera the effects will render in and which mobile devices will support it.

To create multiple files, you will be required to sign up for a free account. The service can otherwise be used without creating one. Oddly enough, the site lets you add more effects when you aren’t logged in. Additional effects that are available (when logged out) are Gradient, Animation and Transition effects. When used as an unregistered user, the site does not let you add multiple effects. If you choose to use the service without registering for an account, you will see a horizontal bar just below the site header that lets you select different effects.

CSS3.0 Maker

If you want to add multiple effects, sign up for a free account and create a file. You can create a file by clicking New File on the home page or by going to My Files. Enter a name for your file. Select Edit and all changes that you make are saved to this file. Go to the Home tab to start editing effects.

CSS3.0 file

To move between different effects, use the drop down menu on the Home tab. To change the color of the element and adjust its opacity, go to the RGBA effect. To add a border or change border styles, go to Border Radius. The Text Shadow and Box Shadow effects create a drop shadow effect behind the element or the text. You can skew and scale it from the CSS Transform effect and offset the border from the element from the Outline Offset effect.

Box Shadow  CSS 3

Once you’ve made all the changes and applied the effects you need, click Save and then Download, to download the file. Make necessary changes and you’ve got your CSS ready to go.

Testing CSS 3.0 Generator

Visit CSS3.0 Maker

Related Articles:
  1. Layer Styles CSS Generator Creates Shadow, Background & Border Effects
  2. Add Shadow Effect To Images With CSS3 Auto Code Generator
  3. Take Screenshots And Auto Add Shadow & Rotate Effects With QuickScreenshots

CSS3.0 Maker – Get CSS Code For Border, Box Shadow Effects & More
Fri, 09 Sep 2011 11:57:17 GMT

Popular posts from this blog

Apple Launches Web Tool to Deregister Phone Numbers from iMessage

Apple today released a new web tool for users to deregister their phone number from iMessage in the event they switched to a non-Apple device. To deregister a phone number from iMessage, users simply enter their phone number in Apple's web tool, receive a free text message containing a code, and submit the code to complete the process. Users who still have their original iPhone can also transfer their SIM card back to the device and go to Settings -> Messages to turn iMessage off. 

Users switching from an iPhone to another device were often unable to receive SMS messages from another iPhone due to their phone number still being linked to iMessage. These specific errors with iMessage have been a well-known issue since 2011, which is when the messaging service debuted with iOS 5. They were also made even more apparent this past May, where a server glitch caused widespread message delivery problems. Apple was even sued over the matter in a California court, although the company cla…

Microsoft acquires iPhone email app Acompli

After accidentally announcing it a little early, Microsoft is officially confirming it has acquired email startup Acompli. The surprise acquisition means Microsoft is picking up a powerful email client for iPhone and Android in another move that further cements CEO Satya Nadella’s focus on cross-platform technologies. The Verge’s Casey Newton called Acompl "the Outlook for iPhone that Microsoft hasn’t yet built," and it seems Microsoft was equally impressed with the powerhouse email app. "We’re excited about what’s possible as we build on the app’s success and bring it together with work currently in progress by the Outlook team," the company said in a statement. "Our goal is to deliver fantastic cross-platform apps that support the variety of email services people use today and help them accomplish more." Recode first reportedthat Microsoft would make its latest acquisition official today; the company is said to be paying over $200 million for Acompli. A…

Apple will disconnect ‘obsolete’ first-gen Apple TV from iTunes in May

Apple has announced today it will drop iTunes support for some older devices from May 25. This includes the first generation Apple TV, and also any PC running Windows XP or Vista. The company is introducing new security changes which will prevent those devices from using the latest version of iTunes.
Apple says that the original Apple TV is an "obsolete Apple product" and will not be updated to support security changes. Only those with the second generation of Apple TV or later will be able to access the iTunes store.
Windows XP or Vista users won't be able to use the latest version of iTunes, but older Windows computers can still use previous versions without support from Apple. Those who do so, however, won't be able to make new purchases or re-download previous purchases on that computer. If you're on on XP or Vista, you'll need to upgrade to Windows 7 or later to continue using iTunes normally.
The writing was already on the wall for these devices: Wi…