• For projects you were supposed to have completed “yesterday,” we have a solution available today. Our ASAP team is… twitter.com/i/web/status/1…

COMPANY BLOG & NEWSROOM

11Aug

Spice Things Up with These Cool JS and CSS Libraries

CSS&JS Frameworks

Work smarter, not harder. There are tons of JavaScript and CSS libraries that can handle routine tasks so you can focus on your incredible design. Here are the coolest libraries and frameworks to get the freshest look around.

JavaScript Libraries

Barba.js. Barba.js uses push state ajax. This script reduces HTTP requests for quicker loading and also allows for some pretty fluid and sweet transitions. Enhance UX even further with faster navigation as well. Barba is small, flexible, and free. How can you say no to that?

Please.js. Want help making your projects beautiful and interesting? Just say “please.” Please.js uses HSV color space to create random colors. Color schemes based on a given color can be created as well. Want to make a random color from another color? Yes, Please can do it!

Trianglify.js Looking for a cool background? Trianglify generates triangle-shaped SVG background images using an algorithm that allows you to specify the amount of randomness, the cell size, and the color palette you want. Even if you aren’t a coder, the Trianglify Generator will let you generate images for your designs.

trianglify

Embed.js. Embed just about anything with embed.js. This pure JavaScript plugin lets you insert or embed all kinds of things from videos and music to tweets, maps, and Gists. If it’s out on the web, you can pretty much embed it in your design with this plugin.

Type.js. Take typographic control of the type styles in your web designs. Type.js allows you to write new CSS to control kerning, widows, and line breaks in your copy. It’s easy to set up and easy to use.

Chartist.js. This isn’t just another charting library. Chartist.js is a front-end chart generator that is fully responsive and gives you great flexibility. The SVG animation API gives you almost limitless possibilities to make your data stand out.

ApproveJs. Automate validation on your terms with ApproveJs. You decide when a value is validated and how errors will be displayed. Easily extends with custom tests. Approve.Js won’t attach itself to input change events, so it doesn’t interfere.

CSS Frameworks

Let’s face it; CSS makes your life easier. Starting with a CSS framework will make using CSS even easier. Here are some great frameworks to provide the structure for your next design.

Blaze_CSS. Blaze_CSS is an open source modular CSS framework that provides great structure for building websites blazing fast. It takes the best of the macro and micro frameworks and creates a modular solution that gives you the best of both worlds.

Skeleton. Skeleton is a very simple, responsive boilerplate framework that is perfect for small projects. While the super lightweight (only 400 lines) framework includes a grid; it only styles a handful of elements. This framework is still more than enough for simple projects.

Picnic CSS. This library is completely modular and weighs in at just under 10kb of compressed CSS. Faster loads are a picnic when you kick start your project with Picnic CSS.

Vital. The Vital CSS framework is built on the principal that less is more. Working with less code means there are fewer bugs to squash and less documentation to read. Less coding, more designing, better documentation. It’s feather light, it loads and renders quickly, and that’s vital for efficient workflow.

vitalcss

Materialize. Materialize is a fresh, responsive front-end framework based on the principles of Material Design. Make life easier for you with speedier development, and easier for your users with a unified responsive system across all platforms. Available in two versions, you decide what best fits your personal preference and skill level.

Bulma. If you want a CSS framework that is based on Flexbox, you want Bulma. This totally responsive design integrates versatile media objects in a way that solves many problems. Customize with Sass or use as is. You only need 1 CSS file to use Bulma.

leave a comment

All posts Back to top