diff --git a/README.md b/README.md
index 41c3c5b..3917b3f 100644
--- a/README.md
+++ b/README.md
@@ -1,90 +1,102 @@
-# rollup-react-starter-lib-ts
+# react-cyber-elemnts
+
+90 Elements.
+
-
- 
+
+ 
-
- 
+
+ 
-
- 
+
+ 
+
+
+ 
+
+
+ 
+
+
+ 
+
+
+ 
-
-
-
-Template to create your own Typescript React library with Rollup.
-
-- Rollup v3 :tada:
-- Compatible with new and old React versions, generates ESM/CJS files.
-
-## Build & Publish
-
-You can use this template and
-change the name under package.json.
-
-Build
-
-```
-npm run build
-```
-
-Build & Watch
-```
-npm run build:watch
-```
+
-Publish (public library)
+
-Be sure you are either logged in under `npm login` or you have a token (check https://docs.npmjs.com/creating-and-viewing-access-tokens).
+Welcome to react-cyber-elements
+You can change the color of the elements with just css.
-```
-npm run publish --access=public
-```
+Simple usage: to
+Checkout the docs and sandbox for more info.
-## For local testing
+## Install
-cd your-lib-folder/
+npm
```
-npm link
+npm install react-cyber-elements
```
-cd your-app/
+yarn
```
-npm link name-of-your-lib
+yarn add react-cyber-elements
```
-### Want to also minify bundle output?
+## Usage
-You can install rollup-plugin-terser (still works with rollup v3, but since it has no updates, we need to install it with legacy peer options)
+
-```
-npm i rollup-plugin-terser --save-dev --legacy-peer-deps
+``` javascript
+import { CyberEl1 } from 'react-cyber-elements'
+
+export default function Home() {
+ return (
+
+ )
+}
```
-#### Configure
+## Changing colors
-rollup.config.mjs
+You can just get access to each path and change stroke and fill properties.
-``` javascript
-import { terser } from 'rollup-plugin-terser';
-
-...
+
- plugins: [
- peerDepsExternal(),
- resolve(),
- commonjs(),
- typescript({ tsconfig: "./tsconfig.json" }),
- terser(), // we add it here
- ]
+``` css
+.cyber-icon path:nth-of-type(1) {
+ fill: #d600ff !important;
+ stroke: orange;
+}
+.cyber-icon path:nth-of-type(2) {
+ fill: #00b8ff !important;
+ stroke: orange;
+}
-```
+.cyber-icon path:nth-of-type(3) {
+ fill: yellow !important;
+ stroke: orange;
+}
+.cyber-icon path:nth-of-type(4) {
+ fill: #001eff !important;
+ stroke: orange;
+}
-[npm-badge]: https://img.shields.io/npm/v/rollup-react-starter-lib-ts.svg
-[npm]: https://www.npmjs.org/package/rollup-react-starter-lib-ts
+.cyber-icon path:nth-of-type(5) {
+ fill: #bd00ff !important;
+}
+```
\ No newline at end of file
diff --git a/icon1.png b/icon1.png
new file mode 100644
index 0000000..ed3de27
Binary files /dev/null and b/icon1.png differ
diff --git a/icon2.png b/icon2.png
new file mode 100644
index 0000000..c5d4604
Binary files /dev/null and b/icon2.png differ
diff --git a/ss1.png b/ss1.png
new file mode 100644
index 0000000..a3b6b89
Binary files /dev/null and b/ss1.png differ