Pastel Dashboard — Admin Template + iPhone web app

Pastel is a unique, feature packed Dashboard with an intuitive and stunning interface.

Version 1.0.1 has just been released! See change log at the bottom of this page.

Main features

Log in screen with animations

Log In Screen
The log in screen features a nice dusky color scheme with immense avatars, subtle textures, flying animations and a graceful log in form.

200+ carefully crafted glyphs

Pastel includes two icon sets: iconSweets 2* and Entypo. Both are using @font-face fonts to effect vector icons in any size or color.

iPhone web app with native gestures

iPhone web app
whether the Pastel mobile layout doesn’t suffice, the included iPhone web app will! flow to http://std.li/7E on your iPhone (add it to your domestic Screen!) It’s ready to spend in approximately three seconds from the first tap. It looks and feels just like a local app. Main features:

  • graceful user interface with subtle textures.
  • Built-in notifications (same as the desktop version of Pastel) with swipe gesture for deletion.
  • Easy chart creation.
  • Maps support (including geo-location) with marker and blue dot
  • Chat bubbles
  • Layered to-achieve list with 3D reveal animations
  • Tabs and modal views

I only support iOS 5 officially at the moment, due to the fresh scrolling features Apple introduced with it. I’ve however tested it on different phones and it works fine on most. Expect both feature and compatibility updates.

Unobtrusive notifications

I’m including a modified version of my accepted Codecanyon notifications plugin. It’s graceful, lightweight and snappily. Main features:

  • Super easy to spend
  • pleasant-looking small notifications
  • graceful CSS3 animations.
  • Time since creation of a notification – updated every 4th moment!
  • Include either an image or a vector icon in your notification.
  • Timeout, set your notification to cloak itself after a certain amount of time.
  • Callback function, believe full control of what will happen after the user clicks on a notification.

Two very different themes

Pastel includes two themes: Skeuo and Feather. Feather is a lighter more breathing theme – a powerful starting point whether you want to customize the appearance heavily. Expect more themes and variations down the road.

Turn customary photos into a full fledged gallery in seconds with the included Pastel Gallery plugin. Easy navigation with the arrow keys.

Maps and geolocation

whether you need to create maps, the Pastel Maps plugin got you covered. It uses the Google Maps Image API for map images. You can easily search for a certain location or fetch a user’s location in HTML5 browsers.

Overlays and menus

It’s dead simple to create a gorgeous black dropdown menu with a few lines of HTML code. Alternatively you can spend the Pastel modal plugin to effect more sophisticated overlays with animations.


It’s easy to effect graceful charts of any kind. Pastel even includes a color tooltip plugin to effect the information really pop.

UI elements

User interface
Pastel includes a lot of different user interface elements, you easily can incorporate in your own application, whether it is a form (with validation), a tags system or the wintry checkbox toggles.

Other key features

  • Fluid and responsive layout: The default layout is fixed at a 1100px width, on smaller screens Pastel will automatically rearrange UI elements until the single mobile column view is reached.
  • Fluid grid: An easy to spend CSS grid framework based on percentages. whether you position more than one section in a grid container, it will automatically net a simple pagination.
  • HTML5 Offline cache with update system: spend the Dashboard, even when no internet connection is present. It will automatically notify users (with notifications) when fresh updates are available. Works in most major browsers, IE9 and downwards excepted.
  • Comprehensive documentation: Every aspect of Pastel has been documented.
  • Hash navigation: No need for fixed browser refreshes.
  • Markdown editor with live preview and code highlighting is included.
  • 30 CSS3 animations are included – every HTML element can easily be lively.
  • Tooltips can be applied to every HTML element.
  • Really graceful error pages are included. Canvas 3D with color particles that tracks the movement of the mouse or your finger on a touch-enabled device.
  • Date picker plugin: Turn an input field into a date picker in seconds.
  • Interactive tables are very easy to initialize. Pastel includes both a simplified (iOS-like) and more traditional pagination.
  • Interactive select boxes with search support.
  • AJAX validation of forms with very microscopic code.
  • Easy-to-spend tabs: You don’t believe to write a single line of code to effect tabs work, everything is handled by the Pastel framework.
  • CSS3 buttons are using the built-in CSS color palettes with support for vector icons.
  • Very rich modal plugin is included. Three different themes, 30 different animations, AJAX load support, fluid or fixed size.
  • Touch optimized: While Pastel does include a seperate iPhone web app, the main Dashboard is optimized for mobile devices. Taps will be registered nearly immediately.
  • Layered to-achieve list: With a 3D turn animation and color degrading appearance.
  • Colorful chat bubbles, iOS-like are included. Easy themeable.
  • Cross-browser compatible: Works in IE8 and upwards. lost CSS3 features degrades naturally.
  • Tags creation: Turn a text field into a graceful tagging form.
  • lively progress bars in different styles.
  • For fun: Pull-to-refresh: Only supported on Chrome and Safari on Mac.
  • iconSweets 2 files are not included with Pastel, but I’ve made an agreement with the icons’ creator, so you can spend them directly from my server, as long as you only spend them with Pastel and don’t download them off the server.

Questions or feedback

Don’t hesitate sending me a mail whether you stumble upon a bug, believe a question the documentation doesn’t acknowledge or simply believe a feature request.

Change log

fresh in 1.0.1 (released 10 March 2012)

  1. Support for external links. Check out the section Navigation in the docs.
  2. entire-fresh file input plugin
    • Much more lightweight than the preceding plugin
    • Doesn’t atomize when used with the validation plugin
  3. Documentation fixes
    • You can now open the documentation locally on browsers that blocks ajax loading of local files (Chrome, Firefox etc.) Note: Only the seperate docs in the Documentation-folder will work locally. The docs in the Dashboard itself still requires uploading to a server (either on your own machine or on the internet).
    • Some minor documentation errors believe been fixed. Added small paragraph on how to spend external links in the section Navigation.

Read UPDATE.md for total change log and install directions.



Related Articles

Back to top button

Adblock Detected

Please consider supporting us by disabling your ad blocker