diff options
author | codecalm <codecalm@gmail.com> | 2020-03-15 18:12:50 +0100 |
---|---|---|
committer | codecalm <codecalm@gmail.com> | 2020-03-15 18:12:50 +0100 |
commit | aa0b63e58cf770abbdb8b7c51a24a6eb869e00f1 (patch) | |
tree | 55e5fdfbd9e1ddf123af8ae20bff8701e975466c /readme.md | |
parent | npm fix (diff) | |
download | tabler-icons-aa0b63e58cf770abbdb8b7c51a24a6eb869e00f1.tar.xz |
readme fix
Diffstat (limited to 'readme.md')
-rw-r--r-- | readme.md | 72 |
1 files changed, 0 insertions, 72 deletions
diff --git a/readme.md b/readme.md deleted file mode 100644 index 389dbcd..0000000 --- a/readme.md +++ /dev/null @@ -1,72 +0,0 @@ -# Tabler Icons - -A set of over 300 free MIT-licensed high-quality SVG icons for you to use in your web projects. Each icon is designed on a 24x24 grid and a `2px` stroke. - -``` -npm install tabler-icons --save -``` - -## Preview - -![](./.github/icons.svg) - - -## Usage - -All icons are built with SVG, so you can place them as `<img>`, `background-image` and inline in HTML code. - -### HTML image - -If you load an icon as an image, you can modify its size using CSS. - -```html -<img src="path/to/icon.svg" alt="icon title"/> -``` - -### Inline HTML - -You can paste the content of the icon file into your HTML code to display it on the page. - -```html -<a href=""> - <svg xmlns="http://www.w3.org/2000/svg" - class="icon tabler-icon tabler-icon-disabled" - width="24" height="24" viewBox="0 0 24 24" - stroke-width="1.25" stroke="currentColor" fill="none" - stroke-linecap="round" stroke-linejoin="round"> - ... - </svg> - Click me -</a> -``` - -Thanks to that, you can change the size, color and the `stroke-width` of the icons with CSS code. - -```css -.icon-tabler { - color: red; - width: 32px; - height: 32px; - stroke-width: 1.25; -} -``` - -### SVG sprite - -Add an icon to be displayed on your page with the following markup (`activity` in the above example can be replaced with any valid icon name): - -```html -<svg width="24" height="24"> - <use xlink:href="path/to/tabler-sprite.svg#tabler-activity"/> -</svg> -``` - -## Multiple strokes - -All icons in this repository have been created with the value of the `stroke-width` property, so if you change the value, you can get different icon variants that will fit in well with your design. - -![](./.github/icons-stroke.svg) - -## License - -Tabler Icons is licensed under the [MIT License](https://github.com/tabler/tabler-icons/blob/master/LICENSE). |