In the past I used Font Awesome icons but since they moved away from free download and you can only use CND via a personal code, I stopped doing that.
I have now added about a hundred of my own icons to css-framework.css.
In the document Icons.php you can copy the code of each icon and paste it into your HTML document.
icon icon-menu
With CSS Framework you have twelve basic colors, hover colors and background colors at your disposal.
The colors for text, buttons and all components can be found on the relevant pages
In the typography document you will find text, paragraphs, headers, fonts, quote, links, markers, horizontal lines, preloads, text dimensions and text shadow.
Here you will also encounter HTML code blocks that you can directly copy and paste into your HTML document.
<p class="text-sm"></p>
With the container class you give the display a maximum width of 1200px, center the container and provide padding.
There is also a 100% wide container with padding.
The classes are part of the responsive sector.
The CSS framework's responsive grid system is extensive and simple to use and gives you the tools to build a responsive website.
The grid system uses four breakpoints:
The classes are part of the responsive sector.
With these classes you can determine the alignment of elements in collaboration with the display-flex
class.
Many parts of this framework have already been created in flexbox mode.
The classes are part of the responsive sector.
The navigation classes allow you to display a well-functioning and cleanly displayed horizontal menu, fully responsive.
The menu can be displayed on the left, centered or right. You can also pin it to the top of the screen (fixed) or have it stick to the top (sticky).
The navbar class is part of the navigation sector.
The sidenav classes allow you to display a well-functioning and cleanly displayed vertical menu, fully responsive.
The sidenav class is part of the navigation sector.
The menu is a standalone navigation menu, with the option of submenus.
The menu classes allow you to display a well-functioning and cleanly displayed vertical menu, fully responsive.
The menu class is part of the navigation sector.
With the button classes you can turn links, buttons and input buttons into beautifully displayed buttons.
There are also icon buttons and dropdown buttons and there is a button that lets the page return to the top.
The button class is part of the navigation sector.
The pagination and breadcrumb classes are presented and explained in the pagination document.
These classes are navigation helpers.
The pagination and breadcrumb classes are part of the navigation sector.
With the border classes you can provide elements with borders, erase borders, determine the thickness and style the borders.
The border classes are one of the many helpers of this framework system.
With the margin classes you can create space around your elements.
The margin classes are one of the many helpers of this framework system.
With the padding classes you can create border space within the elements.
The padding classes are one of the many helpers of this framework system.
With the white-space classes you can create vertical space in your page. (height)
The white-space classes are one of the many helpers of this framework system.
With the width classes you can create horizontal space in your page, both in pixels and in percentages.(width)
The width classes are one of the many helpers of this framework system.
In the miscellaneous document you will find a lot of useful helpers that you will definitely want to use when creating web pages.
All these helpers can simplify the process of creating a web page.
The classes are part of the helpers sector.
Everyone knows an accordion, wide buttons that reveal hidden content.
I supply two types, one with several wide buttons and one with only a normal button.
With the classes provided by this framework you can create sleek and well-functioning accordion.
The accordion classes are part of the components sector.
With the alerts classes you can create four beautiful different alerts.
The four are:
The alerts classes are part of the components sector.
With the badge, badge pill and sign classes you can create sleek and fun notifications, within other elements or on their own.
The classes are part of the components sector.
The card classes allow you to create shadowed areas with text, images, a header, and a footer.
For example, a card is useful as a profile card.
The classes are part of the components sector.
With the form classes you can create a sleek and user-friendly form.
The classes are part of the components sector.
The footer class allows you to add a beautiful footer to your page.
The footer class is part of the navigation sector.
The header class allows you to create a beautiful header for your web page.
The header class is part of the navigation sector.
With these classes you can set and format images.
There is also a simple slider and thumbnail image row that becomes visible after clicking through a modal.
The classes are part of the components sector.
With these classes you can change the appearance of the list.
You give the list lines instead of a point or number.
The classes are part of the components sector.
With the modal classes you can create a popup screen that appears after pressing a button.
In principle you can put all elements on the modal.
The classes are part of the components sector.
With the table classes you can create beautiful and functional tables.
The table is responsive, you can make the table with or without borders, with or without zebra pattern, screen wide or content wide.
You can adjust the columns and headings.
The classes are part of the components sector.
With the tab classes you can create sleek tabs.
The classes are part of the components sector.
With the tooltip classes you can create simple but effective tooltips.
The classes are part of the components sector.