Icons
Icon library
As an icon-library we use Fontawesome.
More specific the 'light' style of the pro-version of Fontawesome 5.
An overview of the available icons
FYI: as an unregistered visitor of the Fontawesome website, many icons might seem unavailable. But we have the licensed version available which gives access to all icons.
If you are a developper for the P&V-brand and need to have access to the icon-library, we can provide you with a project-specific Fontawesome 'kit'. Please contact click@pvgroup.be for further information.
Icon colors
White, orange and light-blue icons can be used as illustrative AND interface components on a dark background.
Burgundy icons can used as illustrative AND interface components on a white or light-grey background
Orange icons can used on a white or light-grey background but ONLY as illustrative components.
Meaning: this colorcombination should never be used as an interface component, as it does not meet the level AA standards for contrast defined in WCAG2.1
Standard icons
Because certain actions/topics can be illustrated with more than one icon, a list of standard icons is available:
This list is not limitative and Icons will be added. When there is a case where multiple icons can serve the same purpose and is not yet listed above, please contact click@pvgroup.be.
Favicon
The favicon for the P&V brand is the colored version of the logo on a white background.
For ease of use, a zip-file with favicons in all sizes and formats to suite every platform can be downloaded.
Extract all files to the root of your website, and add the code below to the <head>-section.
Code
<link rel="apple-touch-icon" sizes="57x57" href="/apple-icon-57x57.png"> <link rel="apple-touch-icon" sizes="60x60" href="/apple-icon-60x60.png"> <link rel="apple-touch-icon" sizes="72x72" href="/apple-icon-72x72.png"> <link rel="apple-touch-icon" sizes="76x76" href="/apple-icon-76x76.png"> <link rel="apple-touch-icon" sizes="114x114" href="/apple-icon-114x114.png"> <link rel="apple-touch-icon" sizes="120x120" href="/apple-icon-120x120.png"> <link rel="apple-touch-icon" sizes="144x144" href="/apple-icon-144x144.png"> <link rel="apple-touch-icon" sizes="152x152" href="/apple-icon-152x152.png"> <link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png"> <link rel="icon" type="image/png" sizes="192x192" href="/android-icon-192x192.png"> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png"> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> <link rel="manifest" href="/manifest.json"> <meta name="msapplication-TileColor" content="#ffffff"> <meta name="msapplication-TileImage" content="/ms-icon-144x144.png"> <meta name="theme-color" content="#ffffff">