Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

tb-icons

Package Overview
Dependencies
Maintainers
1
Versions
155
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

tb-icons

A classified icons set that consists of a part of Material Design icons and some original icons by TB-UI team.

  • 0.2.38
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
7
decreased by-63.16%
Maintainers
1
Weekly downloads
 
Created
Source

TB Icons

A classified icons set that consists of a part of Material Design icons and some original icons by TB-UI team. Available in Icon Fonts and SVG Symbols.

You can check out all Iconfonts or all SVG symbols

Updates

Now the package has updated to version 0.2.0, if you are looking for the old version, checkout v1 branch or open gh-pages/v1.

Installation

npm install tb-icons

Import

  • Webpack

    Make sure install url-loader, file-loader to resolve iconfonts files or svg files, and install target *-loader to import icon stylesheets, like stylus-loader, less-loader, etc.

  • LESS

    @import (css) "path/to/tb-icons/lib/tb-icons.css";
    
  • Stylus

    @import 'path/to/tb-icons/lib/tb-icons.styl'
    
  • Gulp

    Move the fonts with Gulp

    gulp.task('move-fonts', function () {
      gulp.src('node_modules/tb-icons/lib/fonts/**/*')
        .pipe(gulp.dest('path/to/fonts/'))
    })
    

Usage

  • Class Name

    Ensure you've import relative stylesheets, and use it within existed icons

    <span class="icon icon-{Icon Name}"></span>
    
  • SVG Symbols

    Inline combined SVG reference into body, then drop a <use> element snippet

    <svg role="img">
      <use xlink:href="#{Icon Name}></use>
    </svg>
    

    Or directly link the external svg-symbols file:

    <svg role="img">
      <use xlink:href="{Url}/svg-symbols.svg#{Icon Name}"></use>
    </svg>
    

Development

New version of TB-Icons required a valid Sketch file to generate all resources, please make sure you have rights to create more assets, or you can ask designers to distribute that.

All build process can be found in gulpfile.babel.js and local development is required for webpack.

License

MIT

FAQs

Package last updated on 16 Dec 2016

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc