Skip to content
This repository has been archived by the owner on Apr 11, 2020. It is now read-only.

Tools and Resources

dslarri edited this page Oct 5, 2011 · 69 revisions

Cheat Sheets and Templates

(1) be sure to place the downloaded files under /photoshop_root/plug-ins/panels/new-folder/. then restart ps & find it under “windows” > “extenstions”. Be aware that this is not a final version & only works in ps cs4.

Code Generators

  • Blueprinter – generates CSS for Blueprint v1.0.
  • GridCalc – GridCalc – A visual grid calculator and Blueprint CSS generator
    GridCalc takes the pain and guesswork out of calculating a grid that fits your needs. Enter the width of your page, an approximate range for your column and gutter width and GridCalc calculates all the possible combinations and presents them visually. Once you have found a combination that fits your needs GridCalc can generate the Blueprint CSS for version 0.8, 0.9, 0.9.1 and 1.0.
  • BlueCalc CSS Generator — Updated on 2010-08-25
  • Blueprint Grid CSS Generator
  • Blueprint CSS Architect [ BROKEN LINK ]
  • Compress.rb Web GUI – Generates v1.0.1 grids using compress.rb

Layout Editors (WYSIWYG)

Language-specific Utilities

  • CSS Mixin PHP Script [PHP] Mixes CSS classes to provide more meaningful styles
  • Perl/JQuery property-extractor Extract CSS properties from a set of style sheets. The extracted properties could then be used with JQuery (or any other language).
  • JQuery-Plugin-Clear-Css Remove CSS from an element, and from all its children. This JQuery add-on allows the user to remove classes, in-line styles or properties.
  • rounded-borders-corners This page shows how to create rounded corners and rounded borders with BluePrint and JQuery.
  • Grails Plugin

Javascript Background Grid Switchers/Togglers