PHP download

PHP code example of hofff / contao-iconfont

1. Go to this page and download the library: Download hofff/contao-iconfont library. Choose the download type require.

2. Extract the ZIP file and open the index.php.

3. Add this code to the index.php.

    
        
<?php
require_once('vendor/autoload.php');

/* Start to develop here. Best regards https://php-download.com/ */

hofff / contao-iconfont example snippets

+HTML
<i class="fa* fa-icon-name" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-fw" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-2x fa-pull-left" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-2x fa-pull-right" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-2x fa-pull-left fa-border" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-2x fa-pull-right fa-border" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-spin" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-pulse" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-rotate-90" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-rotate-180" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-rotate-270" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-flip-horizontal" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-flip-vertical" aria-hidden="true"></i>

+HTML
<i class="fa* fa-icon-name fa-flip-both" aria-hidden="true"></i>

+HTML
<span class="fa-stack">
	<i class="fas fa-square fa-stack-2x" aria-hidden="true"></i>
	<i class="fa* fa-icon-name fa-stack-1x fa-inverse" aria-hidden="true"></i>
</span>

+HTML
<span class="fa-stack">
	<i class="far fa-square fa-stack-2x" aria-hidden="true"></i>
	<i class="fa* fa-icon-name fa-stack-1x" aria-hidden="true"></i>
</span>

+HTML
<span class="fa-stack">
	<i class="fas fa-circle fa-stack-2x" aria-hidden="true"></i>
	<i class="fa* fa-icon-name fa-stack-1x fa-inverse" aria-hidden="true"></i>
</span>

+HTML
<span class="fa-stack">
	<i class="far fa-circle fa-stack-2x" aria-hidden="true"></i>
	<i class="fa* fa-icon-name fa-stack-1x" aria-hidden="true"></i>
</span>

+HTML
<span class="fa-stack">
	<i class="fa* fa-icon-name fa-stack-1x" aria-hidden="true"></i>
	<i class="fas fa-ban fa-stack-2x" aria-hidden="true"></i>
</span>

+HTML
<i class="icon icon-your-icon-name" aria-hidden="true"></i>

+HTML
/* Include your icon font files */

@font-face {
  font-family: "Your icon font name";
  src: url('your-icon-font-filename.eot') format('embedded-opentype'),
  url('your-icon-font-filename.ttf') format('truetype'),
  url('your-icon-font-filename.woff') format('woff'),
  url('your-icon-font-filename.woff2') format('woff2'),
  url('your-icon-font-filename.svg') format('svg');
}

/* base styles for .icon */

.icon {
  font-family: "Your icon font name";
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* replace individual icon */

.icon-your-icon-1 {
  &:before {
    content: "\XXXX";
  }
}