logo

turretcss

v5.0.0


Developed for design, turretcss is a styles and browser behaviour normalisation framework for rapid development of responsive and accessible websites.

New features

Newly added features include: increasing the size scale, adding sizes for display title and lead, generic group styles, and box shadow utility classes.

Release Notes right

More sizes

Introducing xxs, and xxl sizes for responsive breakpoints, form, button, and typographic elements.

Button Sizes right

Simple grouping

A generic group behaviour to align and space between like items within lists.

Groups right

Box Shadows

Globally set box shadows with size variants to set on any element easily with utility classes.

Box Shadows right

Updated dependencies

PostCSS with postcss-preset-env to write tomorrow's CSS spec today with the polyfills you need.

Learn More right

Principles

Simple. Smart. Modern.

Designed for speed turretcss is designed to make responsive, accessible, and scalable CSS development simple, and predictable.

Simple.
No Javascript. Just clean, simple, and modern CSS.

Write clean, simple, and modern HTML & CSS with intuitive size and style utilities with PostCSS and postcss-preset-env.

Responsive.
Mobile-first, touch designed responsive architecture.

Mobile-first block element styles and full viewport breakpoint coverage makes complex responsive web interface development simple.

Predictable.
Low specificity. Shallow cascade. Predictable styles.

Low specificity and intuitive style inheritance lets you utilise the cascade to style components with consistent options.

Usable.
Designed for every human hand on any type of screen.

Usability is at the core with large tap targets for buttons and link, clear indicator palettes for error handling, and a focus on semantic HTML development.

Customisable.
Easily editable for branded styles for any project.

Easily customise styles with a few simple theme variables, or fully customise the look of elements with full control over visual variables.

Extendable.
No grid. No layout opinions. No worries.

Build custom layouts and interfaces with a solid foundation of typography choices, color options, input types, and full suite of default HTML elements.

Accessible.
Semantic HTML elements, simple CSS styles.

Use the full range of semantic HTML elements with accessible color combinations, and screen reader utility classes to create accessible web interfaces.

Scalable.
Smart viewport scaling variables.

Scale elements larger or smaller with flexible viewport-based calculated variable values. Scale on the fly with consistent size scales for HTML elements and viewports.