25 Cool and Minimalistic Metro Style Scripts

Saturday 25th, March 2017 / 07:44 Written by
25 Cool and Minimalistic Metro Style Scripts
538 Flares Twitter 0 Facebook 0 Google+ 5 LinkedIn 0 StumbleUpon 533 Filament.io 538 Flares ×

Metro style is a minimalistic and really popular design trend created by Microsoft. Creative developers push out all kinds of website templates and metro style scripts to help webmasters use metro design on their websites. Metro is intended to be simple and minimal and this way leave extra space for important content / typography and work well on mobile devices.

We typically see Metro as relatively large boxes in various sizes, all using different strong colors. In addition, the Metro style is characterized by a “flat” look and feel i.e. no bevels and shadows. The metro boxes really looks a bit, like a grid designs and it works well for modern responsive grids like e.g. Boostrap based websites and the grid style themes for WordPress. This collection on CreativeCan is great for finding importation in this area.

Metro style is quite popular at the moment, and I am sure you will benefit from having a few metro scripts in your toolbox. In this article, I have collected some of the best Metro scripts available right now. You may also want to check out some ready to use metro website templates that I would listed at WPBriefly.com. Hope you find this article useful and that you will share it with your friends and coworkers!

MetroTabs with jQuery and CSS3 Effects – MORE INFO / DEMO

metrotabs-with-jquery-and-css3-effects

Metrotabs is a light jQuery plugin to create tabs with the trendy metro style. You can align tabs positions at anywhere you like ( horizontal/vertical or any way ). The content can be anything ( paragraphs, images, video, iframe, … ), every content is an independent file. When a tab is clicked the content of this tab will be load by ajax method with slide effects. You can customize the style of tabs and content by choose from many styles, many colors/images have already created in CSS file or make new ones by your own.

metro.js: recreating Windows 8 UI as a web interface – MORE INFO / DEMO

metro_js

Script helping you to recreate Windows 8 UI as a web interface

Megafolio Pro Responsive Grid jQuery Plugin – MORE INFO / DEMO

megafolio-pro-responsive-grid

Megafolio Pro is a fully responsive media grid plugin that allows you to display content in almost every way possible using preset or randomly generated layouts.

MetroPanel – The New Navigator for Modern Sites – MORE INFO / DEMO

metropanel-banner

Metrotabs is a light jQuery plugin to create tabs with metro style. You can align tabs positions at anywhere you like ( horizontal/vertical or any way ). The content can be anything ( paragraphs, images, video, iframe, … ), every content is an independent file. When a tab is clicked the content of this tab will be load by ajax method with slide effects. You can customize the style of tabs and content by choose from many styles, many colors/images have already created in CSS file or make new ones by your own.

Boot Metro – MORE INFO / DEMO

boot-metro

A simple and flexible HTML, CSS, and Javascript for web apps that wants to use the “Windows 8 App Store” style, without the need to run on Windows 8.

Boot Metro – MORE INFO / DEMO

metro-style-side-menu

Cool minimal navigation in metro style.

tile Js – MORE INFO

tile-js

Windows Metro tiles with Javascript and CSS3 .

Metro Flexible Navigation – MORE INFO / DEMO

metro-flexible-navigation

The Metro Flexible Navigation is a minimal, clean grid layout inspired by the new Windows 8 interface. It can be customized to be laid out horizontally or vertically. It’s scrollable and dragable at the same time and contains useful sliding controls. Icons can be changed, there is a large collection available.

jQmobile metro theme  – MORE INFO / DEMO

jqmobile

Metro CSS3 Mega Menu– MORE INFO

metro-css3-mega-menu

This is a CSS3 Menu inspired in the new Microsoft Metro UI. It comes with 4 different Tile layouts, 5 images animations and more nice features. Is very easy to use and install, well documented and no JavaScript/jQuery.

Onemenu – Responsive Metro UI Menu– MORE INFO / DEMO

onemenu-responsive-metro-ui

OneMenu is a jQuery navigation menu plugin that is created for Metro UI themes. OneMenu supports responsive design, unlimited menus.

MelonHTML5 – Metro Gallery – MORE INFO / DEMO

melon-html5-metro-gallery

Metro Gallery a flexible and easy to integrate photo gallery featured in Metro Design. It allows you to build your unique photo wall with your custom settings.

Metro UI Template – MORE INFO

metro-ui-template

A Template that will help you build Windows 8-style websites with ease.

MelonHTML5 – METRO UI– MORE INFO / DEMO

melon-html5-metro-ui

Metro UI is a flexible and easy to integrate framework to build your one page website in Windows 8 Metro UI. It is fully powered by HTML5, CSS3 and JavaScript with plenty of options for you to configure it to suit your own needs.

Metro Login – MORE INFO / DEMO

metro-login

This is a Login form that use CSS3 and jQuery Tricks to look like windows 8 login screen.

Metro JS – MORE INFO / DEMO

metro-js

Metro JS is a JavaScript plugin for jQuery developed to easily enable Metro interfaces on the web. This release focuses on Live Tiles, the Application Bar and Theming. It’s early in the development phase, but all features should work on at least IE7+(Win/WinPhone), Firefox, Chrome, Android, Opera, and Safari(OSX/iOS).

Metro Help Desk Support Tickets – MORE INFO / DEMO

metro-help-desk

A help desk ticketing system will allow you to provide prompt and efficient support to your clients.
Metro Help Desk comes by default with an integrated FAQ and manuals systems, thus allowing staff members to decrease response time and improve efficiency.

Metro Preloader– MORE INFO / DEMO

metro-preloader

MetroPreloader is a easy to use preloader which gives you this ability to easily setup your website preloading in a nice metro designed loading screen and display the fully loaded website when it finishes.

jQuery Metro Plugin – MORE INFO

metro-plugin

jQuery Metro UI Buttons is an easy way to build websites with a new Metro UI.

MetNav- A jQuery navigation menu based on Metro UI – MORE INFO / DEMO

metnav-jquery-navigation

MetNav is a vertical navigation menu plugin. It is developed on jQuery library.

jQuery UI Themes – MORE INFO

jquery-ui-themes

Using this plugin you can build custom jQuery UI themes based on Metro UI.

Droptiles – MORE INFO

droptiles

Droptiles is an Open Source Windows 8 Start like Metro style Web 2.0 Dashboard. It builds the experience using Tiles. Tiles are mini apps that can fetch data from external sources.

Metro Notifications – MORE INFO / DEMO

metro-notifications

Metro Notifications is a jQuery plugin that brings the notifications to a new level.

UI-Pro – Simple Metro Style Navigation Bar – MORE INFO / DEMO

ui-pro-simple-metro-style-navigation

With this simple jQuery Plugin you can easily create Metro (now simply called Windows 8 UI) style navigation bars. The plugin package comes with the icon pack called iconic created by P.J. Onori, which you can easily set with CSS classes.

Creating a Metro Style Menu in HTML and CSS- MORE INFO

metro-html-css

This tutorial will teach you how to develop a Metro style menu, similar to the start menu of Windows 8 and Windows Phone, using HTML, CSS and Javascript. – See more at: http://mrbool.com/creating-a-metro-style-menu-in-html-and-css/26266#sthash.6WQJSh8s.dpuf

538 Flares Twitter 0 Facebook 0 Google+ 5 LinkedIn 0 StumbleUpon 533 Filament.io 538 Flares ×

About the author

Hi I am Pete! I love to work with web design and sometimes dive into some coding. My main focus is WordPress websites.

View all articles by Pete

2 Comments on “25 Cool and Minimalistic Metro Style Scripts

Comments are closed.