Welcome To Toner

Components for Fast & Beautiful Admin Template.

Build whatever you want without a single line of CSS/SASS code by just using our low-level utility classes and base components.

+

Components

+

Plugins

k

Icons

Bootstrap UI
Alerts

Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages.

Read More
Badges

Documentation and examples for badges, our small count and labeling component.

Read More
Buttons

Use Bootstrap’s custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.

Read More
Colors

Convey meaning through color with a handful of color utility classes. Includes support for styling links with hover states, too.

Read More
Cards

Bootstrap’s cards provide a flexible and extensible content container with multiple variants and options.

Read More
Carousel

A slideshow component for cycling through elements—images or slides of text—like a carousel.

Read More
Dropdowns

oggle contextual overlays for displaying lists of links and more with the Bootstrap dropdown plugin.

Read More
Grid

Use our powerful mobile-first flexbox grid to build layouts of all shapes and sizes thanks to a twelve column system, six default responsive tiers, Sass variables and mixins, and dozens of predefined classes.

Read More
Images

Documentation and examples for opting images into responsive behavior (so they never become wider than their parent) and add lightweight styles to them—all via classes.

Read More
Tabs

Documentation and examples for how to use Bootstrap’s included navigation components.

Read More
Accordion & Collapse

Build vertically collapsing accordions in combination with our Collapse JavaScript plugin.

Read More
Modals

Use Bootstrap’s JavaScript modal plugin to add dialogs to your site for lightboxes, user notifications, or completely custom content.

Read More
Offcanvas

Build hidden sidebars into your project for navigation, shopping carts, and more with a few classes and our JavaScript plugin.

Read More
Placeholders

Use loading placeholders for your components or pages to indicate something may still be loading.

Read More
Progress

Documentation and examples for using Bootstrap custom progress bars featuring support for stacked bars, animated backgrounds, and text labels.

Read More
Notifications

Push notifications to your visitors with a toast, a lightweight and easily customizable alert message.

Read More
Media object

Quickly manage the layout, alignment, and sizing of grid columns, navigation, components, and more with a full suite of responsive flexbox utilities. For more complex implementations, custom CSS may be necessary.

Read More
Embed Video

Use generated pseudo elements to make an element maintain the aspect ratio of your choosing. Perfect for responsively handling video or slideshow embeds based on the width of the parent.

Read More
Typography

Documentation and examples for Bootstrap typography, including global settings, headings, body text, lists, and more.

Read More
Lists

List groups are a flexible and powerful component for displaying a series of content. Modify and extend them to support just about any content within.

Read More
General

Different examples of Popovers,Tooltips,Breadcrumb,Pagination and spinners are given for multipurpose usage.

Read More
Utilities

For faster mobile-friendly and responsive development, Bootstrap includes dozens of utility classes for showing, hiding, aligning, and spacing content.

Read More
Advance UI
Sweet Alerts

A beautiful, responsive, customizable and accessible (WAI-ARIA) replacement for JavaScript's popup boxes.

Read More
Nestable List

A nestable list consists of the list itself, its items and the nestable panel.Sortable is a JavaScript library for reorderable drag-and-drop lists.

Read More
Scrollbar

The scrollbar plugin provides a nice scrollbar for BetterScroll.

Read More
Swiper Slider

Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. It is intended to be used in mobile websites, mobile web apps, and mobile native/hybrid apps.

Read More
Ratings

Rating(Rater js) is the best star rater for the browser. No dependencies. Unlimited number of stars.

Read More
Highlight

Prism is a lightweight, extensible syntax highlighter, built with modern web standards in mind. It’s used in millions of websites, including some of those you visit daily.

Read More
ScrollSpy

Automatically update Bootstrap navigation or list group components based on scroll position to indicate which link is currently active in the viewport.

Read More
Custom UI Custom
Ribbons

Ribbons are used to generate beautiful date ribbons for your posts & articles, animated with CSS3 transitions and transforms.

Read More
Profile

Different types of customised user profile examples are given for demonstration which you can directly use.

Read More
Counter

An animated counter is used to display the counts in an animation starting from 0 and ending at a specific number. This is generally used by many websites to make a web page more attractive.

Read More
Forms
Basic Elements

Form input spin is used to increase and decrease the number.Various example are shown belows.

Read More
Form Select

Choices.js is a vanilla JavaScript plugin that converts the normal select or input into customizable select inputs with multi-select and autocomplete support.

Read More
Checkboxs & Radios

Checkboxes and radio buttons are elements for making selections. Checkboxes allow the user to choose items from a fixed number of alternatives, while radio buttons allow the user to choose exactly one item from a list of several predefined alternatives.

Read More
Pickers

flatpickr is a lightweight and powerful datetime picker. and Colorpickr: Flat, simple, multi-themed, responsive and hackable Color-Picker library.

Read More
Input Masks

Cleave.js javaScript library for formatting input text content when you are typing.

Read More
Advanced

A different types of form input selection methods are given to select element as per your requirements.

Read More
Validation

JavaScript provides a way to validate form's data on the client's computer before sending it to the web server. Form validation generally performs two functions. Basic Validation − First of all, the form must be checked to make sure all the mandatory fields are filled in.

Read More
Wizard

The wizard is a component used for multiple layers of user input elements in the web application.

Read More
Editors

Editor is a set of ready-to-use rich text editors created with a powerful framework. Made with real-time collaborative editing in mind.

Read More
File Uploads

File upload that can upload anything you throw at it, optimizes images for faster uploads, and offers a great, accessible, silky smooth user experience.

Read More
Form Layouts

Web form layout is the way in which all aspects of your form are arranged and where the form is placed on a given web page.

Read More
Tom Select

Tom Select is a dynamic, framework agnostic, and lightweight (~16kb gzipped) UI control. With autocomplete and native-feeling keyboard navigation, it's useful for tagging, contact lists, country selectors, and so on.

Read More
Apexcharts
Line

A Line Chart, or a Line Graph, is a basic type of charts that depicts trends and behaviors over time.

Read More
Area

With their mountain-like appearance, Area Charts are used to represent quantitative variations.

Read More
Column

A Column Chart is a vertical graphical representation of different data categories. It visualizes measured values in rectangular columns or bars plotted along two axes.

Read More
Bar

Bar Charts (also Bar Graphs) are among the most common types of charts used for displaying comparisons between several categories of data and variations of different values.

Read More
Mixed

*Material Design Icons' growing icon collection allows designers and developers targeting various platforms to download icons in the format, color and size they need for any project.

Read More
Timeline

*Material Design Icons' growing icon collection allows designers and developers targeting various platforms to download icons in the format, color and size they need for any project.

Read More
Candlstick

A Candlestick Chart (or Candle Chart) is a type of financial chart that describes the price changes of a security, derivative, or currency.

Read More
Boxplot

A Boxplot chart is a visual representation displaying a given statistical data set based on a five-number summary: the minimum, the first quartile (25th percent), the median (second quartile), the third quartile (75th percent), and the maximum.

Read More
Bubble

An extension of a scatterplot, a bubble chart is commonly used to visualize relationships between three or more numeric variables.

Read More
Scatter

A scatter chart, also called a scatter plot, is a chart that shows the relationship between two variables. They are an incredibly powerful chart type, allowing viewers to immediately understand a relationship or trend, which would be impossible to see in almost any other form.

Read More
Heatmap

A Heat map chart provides a graphical summary of information by representing a set of data through variations in colors.

Read More
Treemap

A Treemap chart (or Treemap graph) is a data visualization method that displays hierarchical (tree-structured) data as a set of nested figures – rectangles.

Read More
Pie

Pie Charts and Donut Charts are instrumental visualization tools useful in expressing data and information in terms of percentages, ratios.

Read More
Radialbar

A Radial Bar Chart, or Circular Gauge, is a typical Bar Chart plotted on a polar coordinate system (instead of a Cartesian plane). It indicates values on a circular numeric scale in terms of percentage with longer bars indicating larger values.

Read More
Radar

The radar chart, also known as spider chart or web chart is equivalent to a parallel coordinates plot in polar coordinates.

Read More
Polar Area

A polar chart has a radial y-axis and a tangential x-axis. Polar coordinate system can be used for bar, line, area, combination, scatter, and bubble charts.

Read More
DESIGN & GRAPHICS
Bootstrap Icon

Free, high quality, open source icon library with over 1,600 icons. Include them anyway you like—SVGs, SVG sprite, or web fonts. Use them with or without Bootstrap in any project.

Read More
Remix Icon

Remix Icon is a set of open-source neutral-style system symbols elaborately crafted for designers and developers. All of the icons are free for both personal and commercial use.

Read More
Boxicons

Simple Open Source icons carefully crafted for designers & developers

Read More
Material Design Icon

Material Design Icons' growing icon collection allows designers and developers targeting various platforms to download icons in the format, color and size they need for any project.

Read More
Phosphor Icon

Phosphor is a flexible icon family for interfaces, diagrams, presentations — whatever, really.

Read More
Tables
Basic Table

The HTML tables are used to present data in grid manner like row and columns. Using Bootstrap you can greatly improve the appearance of table in a quick and easy way.You can create tables with basic styling that has horizontal dividers and small cell padding (8px by default), by just adding the Bootstrap's class .table to the element.

Read More
Grid Js

Grid.js is a Free and open-source JavaScript table plugin. It works with most JavaScript frameworks.

Read More
List Js

List js is a library for adding search, sort, filters and flexibility to tables, lists and various HTML elements.

Read More
Datatables

DataTables is a plug-in for the jQuery Javascript library. It is a highly flexible tool, built upon the foundations of progressive enhancement, that adds all of these advanced features to any HTML table.

Read More
Maps
Google

Google maps library allows you to use the potential of Google Maps in a simple way. No more extensive documentation or large amount of code.

Read More
Vector

Vector js is a lightweight Javascript library for creating interactive maps and pretty data visualization.

Read More
Leaflet

Leaflet js is an open-source JavaScript library for mobile-friendly interactive maps.

Read More
© Toner.
Design & Develop by Themesbrand