Sunday, November 15, 2015



  1. Text
  2. Box - Layout
  3. Animations
  4. Buttons
  5. Filters
  6. Testing
  7. Misc


Box - Layout

  • Layoutit!: drag-and-drop interface builder for Bootstrap.
  • CSS Flexbox: provides for the arrangement of elements on a page such that the elements behave predictably when the page layout must accommodate different screen sizes and different display devices.
  • Flexbox Grid: a grid system based on the flex display property.
  • How To Center In CSS: select the type of content you want to center in a parent div and the size of the parent.


  • animatable: one property, two values, endless possiblities.
  • Animate.css: a bunch of cool, fun, and cross-browser animations.
  • CSS Toggle Switches: accessible, screen-reader friendly, flexible, CSS-only toggle switches with full keyboard access and mobile support, using standard form controls.
  • Hover.css: a collection of CSS3 powered hover effects to be applied to call to actions, buttons, logos, featured images and so on.
  • Magic Animations



Testing & Code Beatutifier

  • Clean CSS: CSS formatter and optimiser.
  • CSS Lint: code quality tool.
  • CSScomb: tool for sorting CSS properties in specific order.


  • -prefix-free: lets you use only unprefixed CSS properties everywhere.
  • Blend: generate simple and beautiful CSS3 gradients.
  • Can I Use: support tables for HTML5, CSS3, etc.
  • Corpus: a collection of CSS things.
  • CSS 3.0 Maker: includes options for:
    • border radius
    • gradient
    • transforms
    • animations
    • transitions
    • RGBA
    • text shadow
    • box shadow
    • text rotation
    • @font face
  • CSS Arrow: generate CSS tooltip arrows.
  • CSS Painter: lets you combine multiple effects to create complex pure CSS objects.
  • CSS3 Pie: makes Internet Explorer 6-9 capable of rendering several of the most useful CSS3 decoration features.
  • CSS3Ps: photoshop plugin that converts your layers to CSS3.
  • CSS Shape Generator
  • Enjoy CSS: online CSS3 code generator with a simple graphical interface.
  • HEX 2 RGBA Color calculator
  • Menu Maker
  • Preloaders: a set of modern CSS3 animations for preloaders.
  • Pure: a set of small, responsive CSS modules.
  • Reset css file
  • Bootsnipp: design elements, playground and code snippets for Bootstrap HTML/CSS/JS framework.
  • Specificity Calculator: a visual way to understand CSS specificity.
  • SpriteBox: WYSIWYG tool to help web designers quickly and easily create CSS classes and IDs from a single sprite image.
  • StyleStats: an evaluating tool for writing better CSS.
  • Tabs Generator
  • uCSS: uCSS is made for crawling (large) websites to find unused CSS selectors.
  • UI Parade: includes options for:
    • button builder
    • form builder
    • icon builder
    • ribbon builder
  • YAML Builder