Close

Admin Dashboard UI

This is an example of a bootstrap admin dashboard user interface with charts, designed using HTML, CSS, JavaScript, and bootstrap framework 4. The icons, images, and fonts are imported to the form with their URLs. The concept of Lists has been used with UL and LI components. UL element has been used with the child elements of LI to display the details in an orderly manner. JavaScript functions Navigation (), Tabs (), Collapse (), Graphs (), LineChart () have been used to implement the charts, graphs, and hover effects. The colors are predefined as @primary: #2DCC70, @body: #2B3A4F, @grey: #92A1A2, @grey-light: #ECF0F1, @blue: #59A4E8, @orange: #E54239, @purple: #8F40B3, @night-blue: #34495E, and @night-blue-dark: #233342. The header section is given the styles of background-color as @primary, height as 80px, and padding as 0 15px. The border-radius for the profile image is set as 50% to get the circle shape. The sidebar items have the styles of color as @grey, font-size as 20px, margin-right as 20px, and change the background-color to @night-blue-dark, and the font color to white, in a hover event. Source: https://codepen.io/Zerka1982/pen/oNgQWPQ

Post Comment or Questions

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Several Related Snippets

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.