diff --git a/README.md b/README.md
index 95024c65..2b6d8823 100644
--- a/README.md
+++ b/README.md
@@ -48,6 +48,7 @@
- [Pattern](#pattern)
- [Marker](#marker)
- [Touch Events](#touch-events)
+- [Serialize](#serialize)
- [Run example](#run-example)
- [TODO](#todo)
- [Known issues](#known-issues)
@@ -1220,6 +1221,67 @@ You can use these events to provide interactivity to your react-native-svg compo
For more examples of touch in action, checkout the [TouchEvents.js examples](https://github.com/magicismight/react-native-svg-example/blob/master/examples/TouchEvents.js).
+### Serialize
+
+```jsx
+import * as React from "react";
+import { Platform, StyleSheet, TouchableOpacity } from "react-native";
+import { Svg, Rect } from "react-native-svg";
+import ReactDOMServer from "react-dom/server";
+
+const isWeb = Platform.OS === "web";
+
+const childToWeb = child => {
+ const { type, props } = child;
+ const name = type && type.displayName;
+ const webName = name && name[0].toLowerCase() + name.slice(1);
+ const Tag = webName ? webName : type;
+ return {toWeb(props.children)};
+};
+
+const toWeb = children => React.Children.map(children, childToWeb);
+
+export default class App extends React.Component {
+ renderSvg() {
+ return (
+
+ );
+ }
+ serialize = () => {
+ const element = this.renderSvg();
+ const webJsx = isWeb ? element : toWeb(element);
+ const svgString = ReactDOMServer.renderToStaticMarkup(webJsx);
+ console.log(svgString);
+ };
+ render() {
+ return (
+
+ {this.renderSvg()}
+
+ );
+ }
+}
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ justifyContent: "center",
+ backgroundColor: "#ecf0f1",
+ padding: 8
+ }
+});
+```
+
### Run example:
```bash