Generates grid guides in Photoshop for the responsive Twitter Bootstrap 3 grid.
Web Designers
Hit download and copy the *.jsx files files from the dist directory
- Twitter Bootstrap 3 Grid Desktop.jsx
- Twitter Bootstrap 3 Grid Large Desktop.jsx
- Twitter Bootstrap 3 Grid Tablet.jsx
- Twitter Bootstrap 3 Grid iPhone Landscape.jsx
- Twitter Bootstrap 3 Grid iPhone Portrait.jsx
- Twitter Bootstrap 3 Grid Fluid.jsx
into your the following folder
<your_photoshop_folder>/presets/scripts
Then restart Photoshop.
Tested with Photoshop CC.
Guide grids can be generated in any document. Just open it, then go to e.g.
Files > Scripts > Twitter Bootstrap 3 Grid Desktop
The script was coded with coffeescript which is compiled to javascript. To build the project you need node.js and grunt. So
- Clone the project
- run $ npm install
- run $ grunt test
- ability to generate grids for large desktops, desktops and tablets
- added support for mobile (iPhone 3/4) grids
- added support for full width grids (thanks to arnaudriegert)