background preloader

CSS Prism by Ryan Berg

CSS Prism by Ryan Berg

CSS Crush — An extensible PHP based CSS pre-processor Edit ‘API functions’ on Github csscrush_file() Process CSS file and return the compiled file URL. csscrush_file( string $file [, array $options ] ) csscrush_tag() Process CSS file and return an html link tag with populated href. csscrush_tag( string $file [, array $options [, array $tag_attributes ]] ) csscrush_inline() Process CSS file and return CSS as text wrapped in html style tags. csscrush_inline( string $file [, array $options [, array $tag_attributes ]] ) csscrush_string() Compile a raw string of CSS string and return it. csscrush_string( string $string [, array $options ] ) csscrush_add_function() Add custom CSS functions. Custom functions added this way are stored on a stack and used by any subsequent compilations within the duration of the script. csscrush_add_function( string $function_name, callable $callback = null ) Parameters $function_name Name of CSS function, or null to clear all functions added with csscrush_add_function(). callback ( array $arguments, stdClass $context )

Stitches - An HTML5 sprite generator Drag & drop image files onto the space below, or use the “Open” link to load images using the file browser. Then, click “Generate” to create a sprite sheet and stylesheet. This demo uses a couple of HTML5 APIs, and it is only compatible with modern browsers. Drag & drop image files onto the space below, or use the “Open” link to load images using the file browser. Stitches is developed by Matthew Cobbs in concert with the lovely open-source community at Github. Copyright © 2013 Matthew Cobbs Licensed under the MIT license. Implementation After dependencies, Stitches requires a stylesheet, a script, and an HTML element to get the job done: The sprite sheet generator is automatically created in elements that have the stitches class: If you choose, any images that are a part of the initial markup will be loaded onto the canvas: Documentation Documentation is available here. Dependencies jQuery 1.7.1, Modernizr 2.0.6, Bootstrap 2.3.0 New Contributing License Download

An Ultimate CSS3 Generator List We all know that CSS3 is changing the Web with its useful and attractive features. As you may know that CSS3 is not compatible with all the Web browsers yet but we can expect to see this compatibility issue resolved in the near future. Web designers are already following CSS3 standards and they have also started implementing them in their Websites. Take a look and get inspired with this useful css3 generator resource list. You might be interested in: CSS3 Maker 3D Ribbon Generator You can start with the examples and modify the values or just start right away. CSS Wrap CSS text to path generator. Ceaser CSS easing animation tool. CSS Gradient Generator A powerful Photoshop-like CSS gradient editor from ColorZilla. CSS3 Rounded Corner Generator This generator will help you create the code necessary to use rounded corners (border-radius) on your webpages. CSS3 Button Generator You can create buttons using this generator including gradients and shadows. Button Maker CSS3 Border Images Color Converter

Sort CSS Properties In A Given Order: CSScomb When writing CSS code, adding CSS properties in a specific order for each rule helps reading it easier so much. For anyone who already does that or not, CSScomb, a free service sorts CSS properties in any order you want (and, their default order is pretty good too -from the most to least important-). It works with both single + multi-line CSS code and besides the online version, there are add-ons provided for the most popular IDEs.

CSS Preprocessors Compared: Sass vs. LESS There are a number of CSS Preprocessor, LESS, Sass, Stylus, and Swith CSS, just to name a few. CSS Preprocessor, as we have said often before, is primarily intended to make authoring CSS more dynamic, organized and productive. But, the question is, which of them does the job best? Well, of course, we wouldn’t be taking a look at every one of them, instead, we will only compare two of the more popular ones: Sass and LESS. To decide, we will compare the two in seven factors: the one that performs better gets one point; in the event of a tie, both will be awarded one point. Let’s begin. Installation Let’s start with the very fundamental step, Installation. Sass: Sass needs Ruby in order to work, in Mac this has been pre-installed, but in Windows you probably need to get it installed before you can start playing with Sass. Read also: Getting Started with Syntactically Awesome Stylesheets Conclusion: LESS is clearly in the lead. Score so far: Sass (0) – LESS (1) Extensions Languages Nesting Sass/Scss