readme

1 files changed, 40 insertions, 7 deletions

diff --git a/readme.md b/readme.md
index be6a859e..e8e62854 100644
--- a/readme.md
+++ b/readme.md
@@ -15,22 +15,55 @@ npm install tabler-icons --save
 
 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 the icon as an image you can manipulate size with CSS.
+
+```html
+<img src="path/to/icon.svg" alt="icon title"/>
+```
+
 ### Inline HTML
 
+You can paste the content of the icon file into the HTML code and it will be displayed 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
+  <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>
 ```
 
+In this way you can change size, color and `stroke-width` of the icon with CSS code.
+
+```css
+.icon-tabler {
+  color: red;
+  width: 32px;
+  height: 32px;
+  stroke-width: 1.25;
+}
+```
+
+### SVG sprite
+
+Include an icon 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#activity"/>
+</svg>
+```
+
 ## Multiple strokes
 
-All icons in this repository are drawn with the value of `stroke` property, so if you change its value you can get different variants of icon, that will fit into your project.
+All icons in this repository are drawn with the value of `stroke-width` property, so if you change its value you can get different variants of icon, that will fit into your project.
 
 ![Tabler icons](icons-stroke.svg)