Update README.md

README.md

@@ -1,6 +1,6 @@
 <div align="center">
 <h1>D2-Live</h1>
-<h3>Generate live diagram URLs with D2</h3>
+<h2>Generate Live Diagram URLs with D2</h2>
 
 [![Publish Status](https://github.com/Watt3r/d2-live/actions/workflows/docker-publish.yml/badge.svg)](https://github.com/Watt3r/d2-live/actions/workflows/docker-publish.yml)
 [![Build Status](https://github.com/Watt3r/d2-live/actions/workflows/build.yml/badge.svg)](https://github.com/Watt3r/d2-live/actions/workflows/build.yml)
@@ -9,26 +9,31 @@
 [![Coverage Status](https://coveralls.io/repos/github/Watt3r/d2-live/badge.svg?branch=master)](https://coveralls.io/github/Watt3r/d2-live?branch=master)
 </div>
 
-## Demo
-
-Given a diagram:
-
-```
-x: That's got to be the best pirate I've ever seen
-x -> y
-y: So it would seem...
-y -> z: Jack Sparrow's theme starts
-z: Fade into horizon
-```
-
-Paste it in [d2-playground](https://play.d2lang.com/), the URL will have an encoded link with a `script` variable: 
-
-```
-LNExDsIwEETR3qf4nSt8ABeUSNCGCzhkRSxIHGUXiHN6ZET9NKORZotcx2ReuRfDCr1go9CLGktekwln_xZaFBWZ3cbhSHU10hWy8Smv59BoCiG42nSPXNLtQbf8FnttnZOgllZTt0dOaRDybIX_ge4bAAD__w%3D%3D
-```
-
-Switch the url to the service URL, for example: `https://d2.atlas.lucas.tools/?script=<encoded_string>`, you will get an svg from the URL:
-
-![Diagram](https://d2.atlas.lucas.tools/?script=LNExDsIwEETR3qf4nSt8ABeUSNCGCzhkRSxIHGUXiHN6ZET9NKORZotcx2ReuRfDCr1go9CLGktekwln_xZaFBWZ3cbhSHU10hWy8Smv59BoCiG42nSPXNLtQbf8FnttnZOgllZTt0dOaRDybIX_ge4bAAD__w%3D%3D)
-
-It is a normal image svg and can be embedded everywhere you want.
+## Aboout
+D2-Live is a dynamic tool for creating live, embeddable diagrams using the D2 language.
+
+## Key Features and Benefits
+- **Effortless Diagram Generation**: Convert text to diagrams instantly.
+- **Live URLs**: Share and embed your diagrams anywhere with live URLs.
+- **SVG Output**: High-quality, scalable vector graphics ensure your diagrams look sharp at any size.
+
+## How to Use D2-Live
+1. **Create a Diagram**: Start with a text-based diagram in D2 language. Example:
+   ```
+   x: That's got to be the best pirate I've ever seen
+   x -> y
+   y: So it would seem...
+   y -> z: Jack Sparrow's theme starts
+   z: Fade into horizon
+   ```
+2. **Use D2-Playground**: Paste your diagram into [d2-playground](https://play.d2lang.com/).
+3. **Generate Live URL**: Change the URL domain to `d2.atlas.lucas.tools`. For example, `https://d2.atlas.lucas.tools/?script=<encoded_string>` gives you an SVG of your diagram.
+4. **Embed and Share**: The SVG diagram can be embedded and shared anywhere.
+
+![Diagram Example](https://d2.atlas.lucas.tools/?script=LNExDsIwEETR3qf4nSt8ABeUSNCGCzhkRSxIHGUXiHN6ZET9NKORZotcx2ReuRfDCr1go9CLGktekwln_xZaFBWZ3cbhSHU10hWy8Smv59BoCiG42nSPXNLtQbf8FnttnZOgllZTt0dOaRDybIX_ge4bAAD__w%3D%3D)
+
+## Contributing to D2-Live
+We welcome contributions! Please refer to our [Contribution Guidelines](https://github.com/Watt3r/d2-live/CONTRIBUTING.md) for details on how to submit changes, coding standards, and testing procedures.
+
+## License
+D2-Live is MIT licensed. For more information, please refer to the [LICENSE](https://github.com/Watt3r/d2-live/blob/master/LICENSE) file.