From our monthly sponsor: Automate manual QA and catch visual bugs with Percy’s all-in-one visual testing and review platform.
Today we are very happy to share the coded version of Peter’s last freebie, the “Land.io” UI Kit + Landing Page Design (Sketch) with you. The template and the UI Kit were carefully coded by Taty Grassini.
About the Land.io Website Template
Land.io is a responsive HTML template, with focus on simplicity, performance and usability. Built on top of Bootstrap 4, it was developed using Sass (new Bootstrap standard) and many of its components and utilities.
The new Cards component was of great help for the featured and pricing sections.
The Spacing utility was heavily used in most parts of the markup. In other words, with these and many more new BS4 niceties, you could easily create a decent landing page without writing a single line of custom CSS.
All CSS was written the Bootstrap way, Code Guide by @mdo is a nice read for everyone coding CSS (and HTML), even if you’re not using BS at all. And, for folks who love to go that extra mile, CSSComb is a must for code readability.
For the HTML5 video section, we used the Video JS plugin. Included are two more video options which you can test in the UI Kit page: Vimeo and YouTube embeds in Bootstrap modals with autoplay and pause/stop functions when you close the modal.
Finally, performance basics are covered: unused Bootstrap SCSS/JS is commented out, assets are minified into single CSS and JS files and the images are optimized.
Hope you guys like it! If you find any bugs, please let me know in the GitHub repo.
The Sketch file
The template was designed by Peter Finlan and you can find all details and information regarding the Sketch file here. Below you can also download it directly.
Check out the live demo of the template: Land.io Live Preview
Don’t forget to check out the demo of the UI elements: Landi.io UI Kit Live Preview
And also the new homepage with a fullscreen slider: Land.io Carousel Live Preview
Edit from Dec 12: Updated to Bootstrap v4.0.0-alpha.2
Download the template for free:
Download the ZIP file and the Sketch design file of the template and UI Kit (see GitHub link below):
The license for Land.io is the Creative Commons Attribution 4.0 International License with the restriction that you can’t redistribute/sell it as-is. Please credit the designer and developer when you base your project on Land.io.Browser Support:
- Internet ExplorerSupported from version 9+
We hope you enjoy this freebie and find it useful!
If you’d like to contribute and publish your freebie on Codrops just drop us a line.