Tag Archives: css

CSS Gradient Editor: Generate CSS Code For Gradient Background [Mac]

by on
Leave a comment
CSS is all that governs how your web page or app will appear to the end user, but writing the basic sheet can take a while. It’s probably why you will find lots of auto CSS code generators that let you add effects, create objects or simple gradients. CSS Gradient Editor is a free Mac app that lets you create gradient backgrounds. The app provides you a simple GUI, letting you select any color for the gradient, add up to five stops and select where each stop is place. The gradient can be vertical or horizontal, and the app lets you create presets and generates CSS code compatible with Chrome, Firefox, Safari, Internet Explorer 10, Opera, all matching the W3C standard. You can enter colors as RGB, HSL and Hex codes. Read More

Text Review: Compare Two Similar Pieces Of Code Or Plain Text [Web]

by on
Leave a comment
If you're a developer, chances are high that you'd have had the need to find out the difference of a div, character or tag between two almost-identical sets of lengthy codes. CSS files, in particular, can go very long, and it would be a tedious task to manually compare them. Text Review, a web application, can be of great help in such a case. It simply overlays one section on top of the other, and when you mouse over a section, the differences clearly stand out. It is a very simple and basic tool, but can be very useful for document comparison or syntax checking. Read More

FormBakery: Instantly Create Deployable Web Forms

by on
Leave a comment
Creating a web form can be a laborious and lengthy task. The HTML part may be easy, but once you start off with the styling, it can easily turn into a nightmare. FormBakery, as the name suggests, bakes these forms for you, aiming to make the task much simplified and easier. This service lets you create web forms that you can instantly deploy on your website. It comes with a easy-to-use interface, and offers users with multiple options. Once you’ve designed a form, you can simply copy the HTML and CSS for it, or export it independently (paid version only). Export supports JavaScript, PHP, HTML and CSS codes. Read More

Print Edit: Edit Unwanted Content When Printing Web Pages [Firefox]

by on
3
Do you wish to print a webpage with only the relevant information you want? Print Edit is a Firefox add-on that can help you get rid of all the unwanted content such as advertisements, side bars and blank pages when you need to print a web page. It easily allows you to edit the webpage in print preview, and lets you select sections of a web page that you want to format, hide or delete before printing. Read More

Pick Colors To Form A Gradient And Get CSS 3 Code With Gradient [Mac]

by on
Leave a comment
Defining CSS 3 class for color gradient is a wearisome task, as one needs to find the required color shades and then mix them together to form a gradient. When the gradient is created, transforming it to CSS3 code (to call it in HTML5) isn’t easy at all; web designers often struggle finding the exact HEX values of different color shades to finally create a CSS class for color gradient. Gradient is a small, elegant application for Mac which lets you pick colors to form a gradient, change gradient shapes, and generate CSS3 code for final version of gradient which you want to use in your website stylesheet document. The application comes with RGB and HEX color code editors to manually adjust the color shades of gradient. Two small color pickers have also been integrated into the application to pick colors off the screen for each gradient color shade. Read More

CSS Usage: View CSS Rules Used On Web Pages & Export File [Firefox]

by on
Leave a comment
Have you ever come across a website and found yourself curious about the styles they’ve used on it? Whether you’re a professional designer working on a site or just learning CSS as a hobby or a side project, checking out how different sites have implemented CSS opens your mind to the many ways you can use it in your own projects. CSS Usage is a Firefox extension that lets you see the CSS rules applied to any web page and also lets you export the CSS sheet in a new tab. Read More

CSS Load: Create & Auto Generate CSS Code For Site Load Animations

by on
1
We’ve reviewed many CSS code generators; some that apply effects to different elements like boxes and layers or the most recent one, XEO CSS, that allow you to edit the CSS by using a visual editor and passing on coding altogether. CSS Load is yet another web application that auto generates CSS code. The code generated is meant for your site load animation. It allows you to pick site load animations from eight templates and customize its color and speed. Read More

XEO CSS: HTML Editor, Visual Editor & Auto Code Generator For CSS

by on
Leave a comment
There are multiple CSS code generators that allow you to add effects either to images, text or elements. These code generators are what they are and give you the CSS code only. Few of them allow you to chose how you would like to load the CSS in your HTML file. What they leave up to you is creating the HTML file and defining classes in it manually. XEO CSS is a CSS code generator and an HTML editor. It creates an HTML file and gives the option to either load classes from HTML, IDs from HTML to elment names from it. Changes to CSS are made via a visual editor and there is little or no coding involved. You can save multiple files by signing up to the service and resume editing them anytime. Read More

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

by on
1
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. Read More

Find Basic Errors In Your CSS Code With CSS Lint

by on
Leave a comment
Ever spend days writing the best CSS code in the world only to discover that something isn’t rendering quite right? What’s worse is that after spending a tedious and somewhat frustrating time trying to find out what’s wrong, you discover it was just a basic syntax error and that’s when you might want to kick yourself. CSS Lint is a web app that performs a basic check on your CSS code. It highlights errors and warns you if there is anything in the code that might not render properly. It lists errors, line number of each error, a brief description of the error and how to fix it. The app also tells you if the error will reflect across all browsers or just one particular browser. Read More

WebPutty – Make CSS Changes To Your Site & View Effects In Real Time

by on
2

Making CSS changes to a live website isn’t something that anyone would take lightly but that’s not to say that you wouldn't want to tweak and experiment every now and then with your site’s design. WebPutty is a web service that provides a safe way to make changes to your site’s CSS, watch how the changes would look on the site and implement them easily if you like what you’ve made.

Read More

Layer Styles CSS Generator Creates Shadow, Background & Border Effects

by on
Leave a comment
CSS makes life simple and websites a whole lot better but there’s still no such as thing as anything being too simple. While CSS may make it easy to apply styles to webpages, creating even a moderately complex CSS can take time. Layer Styles is a CSS generator that lets you create shadow, background and border effects for layers (text or image) using controls that are similar to Photoshop’s layer effect controls. Read More

Add Shadow Effect To Images With CSS3 Auto Code Generator

by on
Leave a comment
CSS lets you style your webpages easily, very easily. You can define over a hundred text styles in one page (of course your page will come out looking like a circus tent) but it’s about the ease and flexibility that comes with using CSS in webpages.ThemeShock has a CSS coder generator that will help you add different drop shadow effects to your images in a few simple clicks. You choose the effect and it writes the code; effects can be added to the bottom, sides, top & bottom, bottom left, bottom right, top right and bottom left or in diagonal corners. Read More

CSS Poster Converts CSS File Into Flow-Chart Like Diagram

by on
1
Handling CSS is easy on small scale, but when it comes to creating a dynamic website or blog with too many elements to handle, it becomes largely difficult for developers to resolve indiscrepancies. In such situations, web developers tend to dry run CSS code right from the outset to find anomalies. Since website with multitude of elements must have an enormous CSS file, it would be a bit challenging to scrutinize each line of code. CSS Poster is a web service to make handling of CSS file easier for you. It does nothing except mapping user-defined CSS file on a simple flow-chart looking diagram, letting you identify problems easily. You can either share the diagram link with others or save it on any local location to share with your development team. Read More

Embed HTML5 And CSS3 Elements Directly With BlueGriffon WYSIWYG Editor

by on
2
Since web standards are evolving continuously with new formats and languages, web development IDEs must have an ability to conform with these latest standards in terms of new language & syntax support, newly applied constraints, and all the newly created formats and web elements. BlueGriffon is a simple WYSIWYG editor which covers the aspects of latest web standards, including HTML5 and CSS3. The application is powered by open source rendering engine of latest Firefox 4 – Gecko, enabling users to deal with web application API and XUL-based interfaces in a better way. It offers a neat interface to let both novice and professional web developers build and manage web content with all the latest web standards-specific tools and features without much effort involved. Take HTML5 for an instance, which supports direct video embedding. With BlueGriffon, you wont need to get a hang of syntaxes to begin with, it allows you to directly embed both HTML5 elements video and audio. Read More

Simple CSS Is Brilliant GUI-Based Cascading Style Sheets Editor

by on
Leave a comment
Editing documents’ styles written in markup language (HTML/XHTML, etc) is easy, once you get the hang of CSS language syntax. Even though understanding classes defined in CSS (Cascading Style Sheet) is not difficult, still many users find it challenging to edit document styles and formatting defined in CSS file. Simple CSS is out to simplify the creation and modification of external CSS files. The application is written for both novices & advance users, since it display all the CSS classes in a sequence, web developers would find it useful in quickly locating the class to edit its attributes whereas beginners wont need to learn language syntax, as it offers pull-down menus for each type of style to define the respective attribute value. Read More

Stylebot: Change Appearance And Apply Styles To Web Page[Chrome Extension]

by on
Leave a comment
Stylebot is an advanced Google Chrome extension to simplify customization of web pages in order to make them more adaptable. It is quite similar to FireBug - the most preferred Firefox webpage inspection extension among web developers. The distinctive feature is that Stylebot allows user to save the customizations made to the web page presentation and appearance, thus letting you load web page elements in any possible way. Read More

HTML Coding Made Easy With Zen Coding

by on
1
Zen Coding is one of the best HTML coding assistant ever created. Confusing at first and perhaps a little tricky to get around, but once you get the hang of it, nothing can beat the ease it will bring to a coder’s life. Zen Coding is basically a set of plugins that can work with a huge variety of text editors (Notepad++, Coda, Espresso, Aptana, Komodo etc, to name a few). Their specialty is to expand abbreviations into complete HTML structures, in a most intelligent, unbelievable way. Read More