Tag Archives: Code

CodePen

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - CodePenVisit Site: CodePen

Cost: Free

Comments: Free web-based code editor.

Description: CodePen is an HTML, CSS, and JavaScript code editor in your browser with instant previews of the code you see and write. You can use it to build and show off interesting things you’ve built, build reduced test cases to troubleshoot with, or collaborate with other front end developers.

Tabs Generator

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - Tabs GeneratorVisit Site: Tabs Generator

Cost: Free

Comments: Free tool for creating tabs in CSS.

Description: Tweak size, colors, corners and more, generate your design, then download and use in your css style sheet!

Meteor

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - MeteorVisit Site: Meteor

Cost: Free

Comments: Free and open source app building platform.

Description: Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you’re an expert developer or just getting started.

Styleneat

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - StyleneatVisit Site: Styleneat

Cost: Free

Comments: Free CSS organizer.

Description: Styleneat organizes and standardizes your CSS in a structure that makes it easier to define page areas and see how they relate to each other.

Colordot

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - ColordotVisit Site: Colordot

Cost: Free

Comments: Free HTML color selector.

Description: Color picker for data driven design. Back & Forth for Hue. Up & Down for Lightness. Scroll for Saturation.

CSS Compressor & Minifier

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - CSS Compressor & MinifierVisit Site: CSS Compressor & Minifier

Cost: Free

Comments: Free CSS compressor.

Description: A click of the mouse is all you need to speed up your webpage load time by up to 80%! Most CSS can be compressed to one third its original size. Our CSS Compressor works with virtually all coding styles of CSS stylesheets and CSS versions.

Codecademy

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Online Courses - CodecademyVisit Site: Codecademy

Cost: Free

Comments: Free programming lessons.

Description: Codecademy is an education company. But not one in the way you might think. We’re committed to building the best learning experience inside and out, making Codecademy the best place for our team to learn, teach, and create the online learning experience of the future.

WaveMaker

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Web Editing - WaveMakerVisit Site: WaveMaker

Cost: Free

Comments: Free and open source application development tool.

Description: WaveMaker is a visual development tool that lets everyone quickly build and deploy great-looking web and cloud applications. With WaveMaker, you can build a complete, 3-tier web application in minutes.

Programmr

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Online Courses - ProgrammrVisit Site: Programmr

Cost: Free

Comments: Free programming lessons.

Description: Programmr is an online interactive lab for students and enthusiasts to learn, practice and become proficient in programming. At Programmr you can code, compile & run projects right in the browser in almost any language.

CSSDesk

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - CSSDeskVisit Site: CSSDesk

Cost: Free

Comments: Free online CSS editor.

Description: CSSDesk is a online HTML/CSS sandbox. Experiment with CSS, see the results live, and share your code with others.

CSS 3.0 Maker

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - CSS 3.0 MakerVisit Site: CSS 3.0 Maker

Cost: Free

Comments: Free online CSS editor.

Description: CSS Maker is a free tool to experiment with CSS properties and values and generate a simple stylesheet for your site.

Typechart

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - TypeChartVisit Site: Typechart

Cost: Free

Comments: Free online CSS typography tool.

Description: Typechart lets you flip through, preview and compare web typography while retrieving the CSS.

CSS Text Wrapper

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - CSS Text WrapperVisit Site: CSS Text Wrapper

Cost: Free

Comments: Free online CSS editor.

Description: The CSS Text Wrapper allows you to easily make HTML text wrap in shapes other than just a rectangle. You can make text wrap around curves, zig-zags, or whatever you want. All you have to do is draw the left and right edges below and then copy the generated code to your website.

Replace CSS Colors

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - Replace CSS ColorsVisit Site: Replace CSS Colors

Cost: Free

Comments: Free online CSS color editor.

Description: Change the entire color scheme of your site with this CSS Color Editor.

CSS Sprite Generator

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - CSS Sprite GeneratorVisit Site: CSS Sprite Generator

Cost: Free

Comments: Free online tool for generating CSS sprites.

Description: CSS sprites are a way to reduce the number of HTTP requests made for image resources referenced by your site. Images are combined into one larger image at defined X and Y coorindates. Having assigned this generated image to relevant page elements the background-position CSS property can then be used to shift the visible area to the required component image.

PXtoEM

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - PXtoEMVisit Site: PXtoEM

Cost: Free

Comments: Free tool for converting PX to EM.

Description: One-click PX/EM/%/PT conversion tables, a custom conversion calculator, and generated reset CSS.

CSS3 Playground

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - CSS3 PlaygroundVisit Site: CSS3 Playground

Cost: Free

Comments: Free online CSS editor.

Description: The CSS3 Playground is a web application for experimenting with some new css3 capabilities. Primarily those than conform to the progressive enhancement philosophy, which means that the styles can be used on all sites without severely changing/limiting the experience on browsers that does not support them (=Internet Explorer 8.0 and older).

CSS Type Set

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - CSS Type SetVisit Site: CSS Type Set

Cost: Free

Comments: Free online CSS typography tool.

Description: CSS Type Set is a hands-on typography tool allowing designers and developers to interactively test and learn how to style their web content.

Ultimate CSS Gradient Generator

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - Ultimate CSS Gradient GeneratorVisit Site: Ultimate CSS Gradient Generator

Cost: Free

Comments: Free online CSS editor for working with gradients.

Description: As you might know, HTML5 introduced many exciting features for Web developers. One of the features is the ability to specify gradients using pure CSS3, without having to create any images and use them as repeating backgrounds for gradient effects.

CSS3, Please!

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - CSS3, PleaseVisit Site: CSS3, Please!

Cost: Free

Comments: Free online CSS editor.

Description: CSS3, Please! The Cross-Browser CSS3 Rule Generator. You can edit the underlined values in this css file, but don’t worry about making sure the corresponding values match, that’s all done automagically for you. Whenever you want, you can copy the whole or part of this page and paste it into your own stylesheet.

CSS Portal

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - CSS PortalVisit Site: CSS Portal

Cost: Free

Comments: Free online CSS editor.

Description: Online CSS Editor allows you to edit an entire CSS file at once with a dynamic preview shown below. The preview will show the exact line you’re editing, and it will update as you type. If you want to show the entire file then move focus to the start or the end of the CSS text.

Learn CSS Layout

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Online Courses - Learn CSS LayoutVisit Site: Learn CSS Layout

Cost: Free

Comments: Free HTML and CSS lessons.

Description: This site teaches the CSS fundamentals that are used in any website’s layout. I assume you already know what selectors, properties, and values are. And you probably know a thing or two about layout, though it may still be a rage-provoking activity for you.

Code Beautifier

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - Code BeautifierVisit Site: Code Beautifier

Cost: Free

Comments: Free CSS optimizer.

Description: Code Beautifier is a CSS formatter and optimizer based on csstidy 1.3.

Clean CSS

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - Clean CSSVisit Site: Clean CSS

Cost: Free

Comments: Free CSS optimizer.

Description: CleanCSS is a powerful CSS optimizer and formatter. Basically, it takes your CSS code and makes it cleaner and more concise.

Instantblueprint

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - InstantblueprintVisit Site: Instantblueprint

Cost: Free

Comments: Free tool for creating web project framework.

Description: Instantblueprint allows you to quickly create a web project framework with valid HTML/XHTML and CSS in only a matter of seconds.

CSS Menu Maker

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 4.5/5 (2 votes cast)

Code - CSS Menu MakerVisit Site: CSS Menu Maker

Cost: Free

Comments: Free tool for creating a CSS menu.

Description: Our menu generators makes it easy to create custom CSS drop down menus without having to know all the complicated code.

CSS Compressor

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - CSS CompressorVisit Site: CSS Compressor

Cost: Free

Comments: Free tool for compressing CSS.

Description: Use this Cascading Style Sheets, CSS Compressor to compress CSS to reduce CSS code size and make your web pages load faster. You can select from four levels of compression, depending on how legible you want the compressed CSS to be versus degree of compression. It is quick, easy and free!

Amaya

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Web Editing - AmayaVisit Site: Amaya

Cost: Free

Comments: Free and open source web editing software.

Description: Amaya is a Web editor, i.e. a tool used to create and update documents directly on the Web. Browsing features are seamlessly integrated with the editing and remote access features in a uniform environment. This follows the original vision of the Web as a space for collaboration and not just a one-way publishing medium.

PrimerCSS

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 4.0/5 (1 vote cast)

Code - Primer CSSVisit Site: PrimerCSS

Cost: Free

Comments: Pulls out classes and IDs for you.

Description: Primer undercoats your CSS by pulling out all of your classes and id’s and placing them into a starter stylesheet. Paste your HTML in to get started.

ProCSSor

VN:F [1.9.22_1171]
Rate This Resource:
Rating: 5.0/5 (1 vote cast)

Code - ProCSSorVisit Site: ProCSSor

Cost: Free

Comments: Easy to use.

Description: Advanced CSS prettifier.