diff --git a/CHANGELOG.md b/CHANGELOG.md
index a7cac7de5c..4330a2a50d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -33,6 +33,7 @@ Our versioning strategy is as follows:
* Richtext component ([#1864](https://github.com/Sitecore/jss/pull/1864))
* Container component ([#1872](https://github.com/Sitecore/jss/pull/1872))
* Angular SXA layout ([#1873](https://github.com/Sitecore/jss/pull/1873))([#1880](https://github.com/Sitecore/jss/pull/1880))([#1890](https://github.com/Sitecore/jss/pull/1890))
+ * Row-Splitter ([#1901](https://github.com/Sitecore/jss/pull/1901))
* Link-List ([#1898](https://github.com/Sitecore/jss/pull/1898))
* Column-Splitter ([#1889](https://github.com/Sitecore/jss/pull/1889))
diff --git a/packages/create-sitecore-jss/src/templates/angular-xmcloud/src/app/components/row-splitter/row-splitter.component.html b/packages/create-sitecore-jss/src/templates/angular-xmcloud/src/app/components/row-splitter/row-splitter.component.html
new file mode 100644
index 0000000000..462221c15b
--- /dev/null
+++ b/packages/create-sitecore-jss/src/templates/angular-xmcloud/src/app/components/row-splitter/row-splitter.component.html
@@ -0,0 +1,10 @@
+
\ No newline at end of file
diff --git a/packages/create-sitecore-jss/src/templates/angular-xmcloud/src/app/components/row-splitter/row-splitter.component.ts b/packages/create-sitecore-jss/src/templates/angular-xmcloud/src/app/components/row-splitter/row-splitter.component.ts
new file mode 100644
index 0000000000..b74784462a
--- /dev/null
+++ b/packages/create-sitecore-jss/src/templates/angular-xmcloud/src/app/components/row-splitter/row-splitter.component.ts
@@ -0,0 +1,30 @@
+import { Component } from '@angular/core';
+import { SxaComponent } from '../sxa.component';
+
+@Component({
+ selector: 'app-row-splitter',
+ templateUrl: './row-splitter.component.html',
+})
+export class RowSplitterComponent extends SxaComponent {
+ get rowSplitterStyles(): string {
+ return `${this.rendering.params.GridParameters ?? ''} ${this.rendering.params.Styles ??
+ ''}`.trimEnd();
+ }
+
+ get rowStyles(): string[] {
+ return Array.from({ length: 8 }, (_, i) => this.rendering.params[`Styles${i + 1}`]);
+ }
+
+ get enabledPlaceholders(): string[] {
+ return this.rendering.params.EnabledPlaceholders.split(',');
+ }
+
+ getRowClass(index: number): string {
+ const styleClass = this.rowStyles[index] || '';
+ return `${styleClass}`.trim();
+ }
+
+ getPlaceholderName(ph: string): string {
+ return `row-${ph}-{*}`;
+ }
+}