MelonHTML5 – Admin7

MelonHTML5 - Admin7 - 1
MelonHTML5 - Admin7 - 2

Single Page App Mode: http://www.melonhtml5.com/demo/admin7/single_page_app/login.html
Static HTML Mode: http://www.melonhtml5.com/demo/admin7/static_html_mode/login.html


Admin7 is a fully responsive admin template powered by HTML5, CSS3 and JavaScript.

Admin7 comes with contemporary Single Page App mode and traditional Static HTML mode.

Admin7 is not a collection of dozons of random jQuery plugins with different design patterns.
every bit of the components are designed from scratch with consistent design sample and coding standards. (Constructor sample in JavaScript and OOCSS principle in CSS).
Performance of each module is highly optimized for different browsers and devices.

Admin7 also gives you full JavaScript APIs for each component and the Main APP itself to allow you to attain more interactions with your own code.

Please give it quick rating whether you like this. whether you fill any suggestions/feature request or you find a bug, you are more than welcome to contact me and I’ll address them ASAP.


Single Page App
Admin7 is designed as a full Single Page App which gives you faster page load, better and contemporary user expierence and much more. With its internal rounting script, you could still share a specific page URL as you generally,normally attain with static html pages and browser’s back and forward button are also fully supported.

Static HTML Mode
Alternatively, you could still write each page as a static HTML page.

Clean, mordern and fully responsive design (tested on every bit of major browsers, tablets and smart phones)

Highly optimized JavaScript code and clean, consistent Markup and CSS give you extremly posthaste and resonsive UI. Each module is optimized individually and as a whole so that when multiple modules are used on the same page, they talk to each other and optimize for each other.

Consistency & Customization
With OOCSS principles used in design, Admin7 provides a very consitent and re-usable UI. It also makes it a lot easier to attain your own customizations. (e.g. chaning the yellow background for tab, widget, button…etc, you will only need to update one site in CSS)

Multiple Skin and Colour Themes
The CSS system is designed to fill skin (layout) and colour scheme separate, which lets you easily create your own skin or colour without breaking the other. 9 theme colours are included by default.


  • Widget
    • Sortable, Collapsible
    • Setting Options
    • AJAX refreshing
  • Data Table
    • Search
    • Sort
    • Colomn/Row hover
    • Checkbox & Radio choice
    • Responsive
  • Button
    • Multiple Sizes and Colours
    • Dropdown Button
    • Split Button
    • Group Button
  • Tooltip
    • Replacement of title attribute
    • 4 directions
  • Tracking Map
  • Progress Bar
  • Grid Layout
  • Star Rating
  • Mailbox
  • Todo List
  • Tile
  • Slider
  • Modal Dialog
    • Draggable
    • Countdown Buttons
  • System Notification
    • Sticky Notification
    • Full APIs
  • Tab / Accordion
  • Form
    • Form Wizard
    • Validations
    • Multiple Sizes
  • Interactive Chart
    • Pie, Bar, Column, Line, Area, Dot, Circular, Combination
    • Project Contribution Graph
    • Live Updating
    • Auto Resizing
  • Tracking Map
  • Calendar
    • Day, Week, Month, Agenda Views
    • Add/Delete/Edit Events
  • File Gallery
    • List View
    • Grid View
    • Detail View


v1.02 @ 18 May 2013

  • Updated Font Awesome to v4.1.0

v1.01 @ 17 July 2013

  • unusual: lock screen
  • unusual: Trend lines
  • CSS improvements
  • JavaScript Tweaks

v1.00 @ 10 July2013

  • Initial release



Related Articles

Back to top button

Adblock Detected

Please consider supporting us by disabling your ad blocker