#A nimble thimble install#

Typography $body-font: -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Ubuntu, Arial, sans-serif This file looks like this out of the box: // Colors $blue: #2266a7 ThimbleCSS includes a simple Override file that can be adjusted and added to for all SASS variables. Create out of the box responsive headers by adding the class vw to any header.sub-heading. ThimbleCSS's basic heading typographic hierarchy is based on the Augmented Fourth scale (1.414). align-fullĬontent push just outside the bounds of centered container.Ĭontent will push page width from inside centered container. ThimbleCSS provides two simple classes for pushing content safely and responsively outside of a centered content container.align-wide.

Sometimes you want to break the rigid constraints of a centered container. A container class can be combined with grid class. The example below is a simplified version of the container for this page. BasicsĪ simple way to contain and center your ntainer. cell This is the basic column and grid block. grid Wrap all your grids this class, regardless of direction and orientation. Grids have full flexbox alignment and spacing capabilities. For Ruby on Rails, add the core thimble file to your 'thimblecss/scss/thimble' Ī simple and clean 12 column XY grid with cell-level padding and margin control.

#A nimble thimble install#

Install with npm, yarn, or download and compile on your own to get started. ThimbleCSS uses a built in version of sanitize.css to let the browser do the work. No JS requirements, huge settings files to manage, or css overrides that get in the way.

Use only the CSS threads you need to start building.