Social Buttons Fullwidth

Huge box of buttons of any size, any animation and any color

Theme Color Background

<div class="social-icons social-lmedium social-icons-fw-theme">
  <a href="#" class="btn btn-social-icon btn-facebook">
    <i class="fa fa-facebook"></i>
  </a>
  
  <a href="#" class="btn btn-social-icon btn-twitter">
    <i class="fa fa-twitter"></i>
  </a>
  
  <a href="#" class="btn btn-social-icon btn-google">
    <i class="fa fa-google"></i>
  </a>
  
  <a href="#" class="btn btn-social-icon btn-instagram">
    <i class="fa fa-instagram"></i>
  </a>
  
  <a href="#" class="btn btn-social-icon btn-github">
    <i class="fa fa-github"></i>
  </a>
  
  <a href="#" class="btn btn-social-icon btn-linkedin">
    <i class="fa fa-linkedin"></i>
  </a></div>

Transparent Background

<div class="social-icons social-coloured social-color-native social-lmedium social-icons-fw">
  <a href="#" class="btn btn-social-icon btn-facebook">
    <i class="fa fa-facebook"></i>
  </a>
  
  <a href="#" class="btn btn-social-icon btn-twitter">
    <i class="fa fa-twitter"></i>
  </a>
  
  <a href="#" class="btn btn-social-icon btn-google">
    <i class="fa fa-google"></i>
  </a>
  
  <a href="#" class="btn btn-social-icon btn-instagram">
    <i class="fa fa-instagram"></i>
  </a>
  
  <a href="#" class="btn btn-social-icon btn-github">
    <i class="fa fa-github"></i>
  </a>
  
  <a href="#" class="btn btn-social-icon btn-linkedin">
    <i class="fa fa-linkedin"></i>
  </a></div>

Image Background

<div class="social-icons social-lmedium social-icons-fw-image">
  <div class="social-fw-inner">
    <a href="#" class="btn btn-social-icon btn-facebook">
      <i class="fa fa-facebook"></i>
    </a>
    
    <a href="#" class="btn btn-social-icon btn-twitter">
      <i class="fa fa-twitter"></i>
    </a>
    
    <a href="#" class="btn btn-social-icon btn-google">
      <i class="fa fa-google"></i>
    </a>
    
    <a href="#" class="btn btn-social-icon btn-instagram">
      <i class="fa fa-instagram"></i>
    </a>
    
    <a href="#" class="btn btn-social-icon btn-github">
      <i class="fa fa-github"></i>
    </a>
    
    <a href="#" class="btn btn-social-icon btn-linkedin">
      <i class="fa fa-linkedin"></i>
    </a>  </div>
</div>

With text

<div class="social-icons social-lmedium social-icons-fw-image">
  <h3>learn more about our life in social networks</h3>
  <div class="social-fw-inner">
    <a href="#" class="btn btn-social-icon btn-facebook">
      <i class="fa fa-facebook"></i>
    </a>
    
    <a href="#" class="btn btn-social-icon btn-twitter">
      <i class="fa fa-twitter"></i>
    </a>
    
    <a href="#" class="btn btn-social-icon btn-google">
      <i class="fa fa-google"></i>
    </a>
    
    <a href="#" class="btn btn-social-icon btn-instagram">
      <i class="fa fa-instagram"></i>
    </a>
    
    <a href="#" class="btn btn-social-icon btn-github">
      <i class="fa fa-github"></i>
    </a>
    
    <a href="#" class="btn btn-social-icon btn-linkedin">
      <i class="fa fa-linkedin"></i>
    </a>  </div>
  <h3>awesome</h3>
</div>

⌃

Open Kate Lab

Dark theme *
Theme color *
- Default colors:
- Google design guidelines colors:
- Custom color:
Boxed layout *
Scrollbar
- Browser Default Smooth scrolling
- Slim scrollbar Slim + Smooth
Button border radius
- Default Squared Pill
Shop
- Modal minicart
- Sync cart & modalcart
Form options
- Default form fields *
- Thick form field borders *
- Default Checkboxes
Default modal window*
Slab headings *
Disable parallax
Frame mode
Disable page transition

* without reload

Code pane