AgileUI v2.0
  • Dashboard
  • Components
    • Grid Layouts
    • Helpers
    • Timeline
    • Dashboard panels
    • Tile buttons
    • Social boxes
    • Todo list
    • Chat
    • Calendar
    • Notifications
    • Messaging
    • Progress
  • Fixed layout
    • Static sidebar Fixed sidebar
    • Static header Fixed header
    • Fixed footer Static footer
  • Pages
    • Login example 1
    • Login example 2
  • Widgets 19
    • Tabs
    • Accordions
    • Datepicker
    • Timepicker
    • Colorpicker
    • Sliders
    • JGrowl Notifications
    • Noty Notifications
    • Modal Windows
    • Tooltips
    • Popovers
    • Sortable Elements
    • Dropdown Menus
  • Elements
    • Content Boxes
    • Response Messages
    • Information boxes
    • Badges & Labels
    • Overlays
    • Navigation Menus
    • Loading bars
    • Icons
    • Buttons
    • Pagination
    • Progress Bars
    • Typography
    • Animations
  • Data visualization
    • xCharts
    • Pie Gauges
    • JustGage
    • Sparklines
    • Morris Charts
  • Maps API
    • Google maps
    • Vector maps
  • Tables
    • Normal tables
    • Dynamic tables
  • Forms
    • Layouts & Elements
    • Forms validation
    • Forms input masks
    • Input knobs
    • Form wizard
    • Inline editor
    • Image crop
    • Files uploader
    • Dropzone uploader
  • Change theme +6
    • Gray orange
    • Gray light, blue dark
    • Gray, blue light
    • Gray black
    • White green
    • White orange
    • White blue light
    • Default
    • All black

Modal windows

Thanks to the solid modular AgileUI arhitecture, modal windows customizations are very flexible and easy to apply.

Icons All icons across the AgileUI Framework use FontAwesome icons.

t
Page examples
  • Login pages
    • Login example 1
    • Login example 2
    • Submenus
      • Nav link 1
      • Nav link 2
      • Nav link 3
    • Dummy link
  • Different color link
  • Link with red icon
  • 7 Link with badge
Layout options
  • Fixed Elements:
  • Static sidebar Fixed sidebar
  • Static header Fixed header
  • Fixed footer Static footer
  • First
  • Second
  • Third

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.

Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.

Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.

Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.

Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque

Dropdown menus
Horia Simon
  • 7 Account Details
  • Edit Profile
  • Notifications
  • Logout
  • Dropdown menu
    • Submenu 1
    • Submenu 2
    • Submenu 3
      • Submenu 2-1
      • Submenu 2-2
  • Another menu item
18
  • Important message
    3 hr ago
    This message must be read immediately because of it's high importance...
  • Some random email
    3 hr ago
    This message must be read immediately because of it's high importance...
  • Another received message
    3 hr ago
    This message must be read immediately because of it's high importance...
  • Important message
    3 hr ago
    This message must be read immediately because of it's high importance...
  • Some random email
    3 hr ago
    This message must be read immediately because of it's high importance...
  • Another received message
    3 hr ago
    This message must be read immediately because of it's high importance...
All messages
5
  • This is an error notification
    a few seconds ago
  • This is a warning notification
    15 minutes ago
  • A success message example.
    2 hours ago
  • This is an error notification
    a few seconds ago
  • This is a warning notification
    15 minutes ago
  • Alternate notification styling.
    2 hours ago
View all notifications
21
  • Finishing uploading files 23%
  • Roadmap progress 91%
  • Images upload 58%
  • WordPress migration 74%
  • Agile development procedures 91%
  • Systems integration 58%
  • Code optimizations 97%
View all
Layout Color Schemes:

Click to change the layout color scheme. You can associate different color schemes for layouts and main content elements.

Elements Color Schemes:

When you select a layout color scheme the elements inherit the styles from it, but you can also choose a different color scheme only for elements.

Example button
Dashboard Elements Example breadcrumb
Form example

This dropdown box uses the Twitter Bootstrap dropdown plugin.

Validate the form above
Custom header example

AgileUI comes with powerful helpers that you can use to create virtually any style you want. Read the documentation about helper classes to find out more!

Tile buttons Tile buttons can be used to both show all kinds of infos.

Basic

These examples have both a header and a footer with additional informations.

YoY Growth
$ 378
+7,6% new users in the first quarter
view details
YoY Growth
$ 378
+7,6% new users in the first quarter
view details
YoY Growth
$ 378
+7,6% new users in the first quarter
view details
YoY Growth
$ 378
+7,6% new users in the first quarter
view details
YoY Growth
$ 378
+7,6% new users in the first quarter
view details
YoY Growth
$ 378
+7,6% new users in the first quarter
view details
YoY Growth
$ 378
+7,6% new users in the first quarter
view details
YoY Growth
$ 378
+7,6% new users in the first quarter
view details

Alternate style

These examples have differ a little from the ones above.

YoY Growth
+55%
$ 378
YoY Growth
+55%
$ 378
YoY Growth
+55%
$ 378
YoY Growth
+55%
$ 378
YoY Growth
+55%
$ 378
YoY Growth
+55%
$ 378
YoY Growth
+55%
$ 378
YoY Growth
+55%
$ 378