Freebie: “Libre” Web App Template


Today we’d like to share Libre, a responsive single page app template with you. Libre was designed for developers who want to create collection management-like projects (e.g. books, music, podcasts, games, etc.). Built with tailwind.css and vanilla JavaScript, this template is easily customizable and has common components like profile, lists, filters and popovers which set the ground work for your projects.




Libre also comes with a Sketch design file. You can use Libre freely for your personal project or commercially, for your client work.

Live demo

Check out the live demo: Libre Live Preview

Download the template for free:

You can download the ZIP file of the template and the design file here:

Use it freely but please don’t republish or redistribute the template.

Running the project locally

Make sure your npm version is v6+. I currently am using v10.8 as of Aug 2018.

npm install

If you want to regenerate the CSS with your changes, run this command to generate the CSS using tailwind config (e.g. tailwind.js)

$ ./node_modules/.bin/tailwind build style.css -c ./tailwind.js -o ./output.css

If you want to recompile the JavaScript, make sure browserify is installed globally then run this command to create bundle.js:

$ npm install -g browserify
$ browserify main.js -o bundle.js

We hope you enjoy this freebie and find it useful!

If you’d like to contribute and publish your freebie on Codrops drop us a line.

Freebie: “Libre” Web App Template was written by Amie Chen and published on Codrops.

Leave a Reply


"Kyle has helped our company’s image a lot by redesigning our logo, creating our new website and putting together some great, eye-catching ads. He’s very easy to work with and we were able to hit all of our deadlines."
Elliot Feder - Director of Business Development, SpringBoard Data Management
"Kyle has a natural talent for taking any idea I have and turning it into a visual work of art. He is a genius with layouts and overall concepts, the first person I call when I know a project needs to be done right."
Cheryl Bell, Executive Business Manager, Global Automotive Consultants