diff options
author | Michal Wolny <michal.wolny@versum.pl> | 2020-10-06 19:28:20 +0200 |
---|---|---|
committer | Michal Wolny <michal.wolny@versum.pl> | 2020-10-06 19:28:20 +0200 |
commit | d82841119820b4814169a8fa42a88f166f406a6f (patch) | |
tree | 5617b40088a57a19c74b454d949bbba5d3b63c63 /README.md | |
parent | Release 1.33.0 (diff) | |
download | tabler-icons-d82841119820b4814169a8fa42a88f166f406a6f.tar.xz |
[dev-icons-react-bundling] change svgr template to enable babel transformation, add babel with react and env, add rollup for commonJS, UMD and ESM, add gulp and npm tasks for building react, add peer react and react-dom dependencies, add needed deps, updated npm package files, updated readme
Diffstat (limited to 'README.md')
-rw-r--r-- | README.md | 19 |
1 files changed, 19 insertions, 0 deletions
@@ -73,6 +73,25 @@ Add an icon to be displayed on your page with the following markup (`activity` i </svg> ``` +### React + +Import the icon and render it in your component. You can adjust SVG properties through React props: + +```jsx +import { IconAward } from 'tabler-icons'; + +const MyComponent = () => { + return <IconAward + size={36} // set custom `width` and `height` + color="red" // set `stroke` color + stroke={3} // set `stroke-width` + strokeLinejoin="miter" // override other SVG props + /> +} +``` + +`tabler-icons` exports it's own type declarations for usage with React and Typescript. + ## 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. |