diff --git a/examples/web/react/app.tsx b/examples/web/react/app.tsx
index 3ee47fffd2c15feb51f8e67d7bc6384feea86d60..485657e62aa904b90e441effad59d1bb779d1b6c 100644
--- a/examples/web/react/app.tsx
+++ b/examples/web/react/app.tsx
@@ -6,7 +6,8 @@ import {
     ButtonIncrement,
     ButtonSwitch,
     Info,
-    Pair
+    Pair,
+    Section
 } from "./components";
 
 import "./app.css";
@@ -17,41 +18,47 @@ export const App = () => {
     const onClick = () => setCount(count + 1);
     return (
         <>
-            <Button text={getText()} onClick={onClick} />
-            <Button
-                text={getText()}
-                image={require("../res/pause.svg")}
-                imageAlt="tobias"
-                onClick={onClick}
-            />
-            <Info>
-                <Pair key="tobias" name={"Tobias"} value={`Count ${count}`} />
-                <Pair key="matias" name={"Matias"} value={"3"} />
-                <Pair
-                    key="button-tobias"
-                    name={"Button Increment"}
-                    valueNode={
-                        <ButtonIncrement
-                            value={200}
-                            delta={100}
-                            min={0}
-                            suffix={"Hz"}
-                        />
-                    }
+            <Section>
+                <Button text={getText()} onClick={onClick} />
+                <Button
+                    text={getText()}
+                    image={require("../res/pause.svg")}
+                    imageAlt="tobias"
+                    onClick={onClick}
                 />
-                <Pair
-                    key="button-cpu"
-                    name={"Button Switch"}
-                    valueNode={
-                        <ButtonSwitch
-                            options={["NEO", "CLASSIC"]}
-                            size={"large"}
-                            style={["simple"]}
-                            onChange={(v) => alert(v)}
-                        />
-                    }
-                />
-            </Info>
+                <Info>
+                    <Pair
+                        key="tobias"
+                        name={"Tobias"}
+                        value={`Count ${count}`}
+                    />
+                    <Pair key="matias" name={"Matias"} value={"3"} />
+                    <Pair
+                        key="button-tobias"
+                        name={"Button Increment"}
+                        valueNode={
+                            <ButtonIncrement
+                                value={200}
+                                delta={100}
+                                min={0}
+                                suffix={"Hz"}
+                            />
+                        }
+                    />
+                    <Pair
+                        key="button-cpu"
+                        name={"Button Switch"}
+                        valueNode={
+                            <ButtonSwitch
+                                options={["NEO", "CLASSIC"]}
+                                size={"large"}
+                                style={["simple"]}
+                                onChange={(v) => alert(v)}
+                            />
+                        }
+                    />
+                </Info>
+            </Section>
         </>
     );
 };
diff --git a/examples/web/react/components/index.ts b/examples/web/react/components/index.ts
index 4672a519099ee2ab6a13b7942aecc8a60df3711a..ce050ee2b75590fc70e1b933447c51ce2288db77 100644
--- a/examples/web/react/components/index.ts
+++ b/examples/web/react/components/index.ts
@@ -3,4 +3,5 @@ export * from "./button-increment/button-increment";
 export * from "./button-switch/button-switch";
 export * from "./info/info";
 export * from "./pair/pair";
+export * from "./panel-split/panel-split";
 export * from "./section/section";
diff --git a/examples/web/react/components/panel-split/panel-split.css b/examples/web/react/components/panel-split/panel-split.css
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/examples/web/react/components/panel-split/panel-split.tsx b/examples/web/react/components/panel-split/panel-split.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..e6966f201236539222e85435d7565b4a90be34f1
--- /dev/null
+++ b/examples/web/react/components/panel-split/panel-split.tsx
@@ -0,0 +1,15 @@
+import React, { FC, ReactNode } from "react";
+
+import "./panel-split.css";
+
+type PanelSplitProps = {
+    children: ReactNode;
+    style?: string[];
+};
+
+export const PanelSplit: FC<PanelSplitProps> = ({ children, style = [] }) => {
+    const classes = () => ["panel-split", ...style].join(" ");
+    return <></>;
+};
+
+export default PanelSplit;
diff --git a/examples/web/react/components/section/section.css b/examples/web/react/components/section/section.css
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..21d28b608df1283f100370f34ac88b11ffabfb47 100644
--- a/examples/web/react/components/section/section.css
+++ b/examples/web/react/components/section/section.css
@@ -0,0 +1,5 @@
+.section > .separator {
+    height: 2px;
+    background: #ffffff;
+    margin: 22px 0px 22px 0px;
+}