diff --git a/apps/web/src/app/workspaces/components/capability-request/capability-request.component.html b/apps/web/src/app/workspaces/components/capability-request/capability-request.component.html
index 2d8f5ef0a136418d8a4a8302da9f5ffe7e1f68b7..a91bf844c4928b9268eddd66cec82adcd276da21 100644
--- a/apps/web/src/app/workspaces/components/capability-request/capability-request.component.html
+++ b/apps/web/src/app/workspaces/components/capability-request/capability-request.component.html
@@ -1 +1,10 @@
-<app-request-header></app-request-header>
+<header>
+  <app-request-header></app-request-header>
+</header>
+<div id="definition-parameters-and-versions">
+  <div id="capability-definition-container">
+    <span id="capability-label">Capability</span>
+    <app-capability-definition id="capability-definition"></app-capability-definition>
+  </div>
+  <h1 id="parameters">PARAMETERS!!!!!!!!!!!!</h1>
+</div>
diff --git a/apps/web/src/app/workspaces/components/capability-request/capability-request.component.scss b/apps/web/src/app/workspaces/components/capability-request/capability-request.component.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..796064d9c2bb4b704dc78bc4a2cc5eeb9ff81576 100644
--- a/apps/web/src/app/workspaces/components/capability-request/capability-request.component.scss
+++ b/apps/web/src/app/workspaces/components/capability-request/capability-request.component.scss
@@ -0,0 +1,18 @@
+div {
+  width: 100%;
+  padding: 0.5rem 3rem;
+  display: inline-grid;
+}
+
+#definition-parameters-and-versions {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  background: linear-gradient(0deg, rgba(220, 220, 220, 1) 0%, rgba(240, 240, 240, 1) 100%);
+}
+
+#capability-definition {
+  justify-self: left;
+}
+#parameters {
+  justify-self: right;
+}
diff --git a/apps/web/src/app/workspaces/components/capability-request/components/capability-definition/capability-definition.component.html b/apps/web/src/app/workspaces/components/capability-request/components/capability-definition/capability-definition.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..213e6878522349b8c8e1f22252be9f32c96abdbb
--- /dev/null
+++ b/apps/web/src/app/workspaces/components/capability-request/components/capability-definition/capability-definition.component.html
@@ -0,0 +1,10 @@
+<div id="definition-container">
+  <h5 id="capability-name">null</h5>
+
+  <div id="step-sequence">
+    <ul>
+      <li>Step 1</li>
+      <li>Step 2</li>
+    </ul>
+  </div>
+</div>
diff --git a/apps/web/src/app/workspaces/components/capability-request/components/capability-definition/capability-definition.component.scss b/apps/web/src/app/workspaces/components/capability-request/components/capability-definition/capability-definition.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e865be441231ff1ef1ff7752fc91e6526ac230d6
--- /dev/null
+++ b/apps/web/src/app/workspaces/components/capability-request/components/capability-definition/capability-definition.component.scss
@@ -0,0 +1,7 @@
+#definition-container {
+  background-color: #ffffff;
+  border-radius: 10px;
+  border-top: 4px #909090 solid;
+
+  padding: 0.25rem 0.5rem;
+}
diff --git a/apps/web/src/app/workspaces/components/capability-request/components/capability-definition/capability-definition.component.spec.ts b/apps/web/src/app/workspaces/components/capability-request/components/capability-definition/capability-definition.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..571e4248869343d4bc84e55440154d93a8a7c191
--- /dev/null
+++ b/apps/web/src/app/workspaces/components/capability-request/components/capability-definition/capability-definition.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CapabilityDefinitionComponent } from './capability-definition.component';
+
+describe('CapabilityDefinitionComponent', () => {
+  let component: CapabilityDefinitionComponent;
+  let fixture: ComponentFixture<CapabilityDefinitionComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ CapabilityDefinitionComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CapabilityDefinitionComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/apps/web/src/app/workspaces/components/capability-request/components/capability-definition/capability-definition.component.ts b/apps/web/src/app/workspaces/components/capability-request/components/capability-definition/capability-definition.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..4c7328127348779d920eac000e93dee54351e7c3
--- /dev/null
+++ b/apps/web/src/app/workspaces/components/capability-request/components/capability-definition/capability-definition.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-capability-definition',
+  templateUrl: './capability-definition.component.html',
+  styleUrls: ['./capability-definition.component.scss']
+})
+export class CapabilityDefinitionComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}
diff --git a/apps/web/src/app/workspaces/components/capability-request/components/request-header/request-header.component.scss b/apps/web/src/app/workspaces/components/capability-request/components/request-header/request-header.component.scss
index adafcc23a10b61bafc28903b4983c4d4c6fe1136..b8706a8d76f1e8a51c7743a14eeb78cb53863c37 100644
--- a/apps/web/src/app/workspaces/components/capability-request/components/request-header/request-header.component.scss
+++ b/apps/web/src/app/workspaces/components/capability-request/components/request-header/request-header.component.scss
@@ -11,7 +11,7 @@ div {
 
 #request-id-and-status {
   grid-template-areas: "id status";
-  border-bottom: 1px solid #e0e0e0;
+  border-bottom: 1px solid #d4d4d4;
 }
 #request-id {
   grid-area: id;
diff --git a/apps/web/src/app/workspaces/workspaces.module.ts b/apps/web/src/app/workspaces/workspaces.module.ts
index 1e9d79da6e0b46efaeeb16e6b95b7fbeab937776..8ebffd19724fcde19e80cbe68530b378d8d6ba47 100644
--- a/apps/web/src/app/workspaces/workspaces.module.ts
+++ b/apps/web/src/app/workspaces/workspaces.module.ts
@@ -6,6 +6,7 @@ import { FormsModule, ReactiveFormsModule } from "@angular/forms";
 import { CapabilityRequestComponent } from "./components/capability-request/capability-request.component";
 import { RequestHeaderComponent } from "./components/capability-request/components/request-header/request-header.component";
 import { RunningStatusButtonComponent } from "./components/capability-request/components/status-buttons/running-status-button/running-status-button.component";
+import { CapabilityDefinitionComponent } from "./components/capability-request/components/capability-definition/capability-definition.component";
 
 @NgModule({
   declarations: [
@@ -13,6 +14,7 @@ import { RunningStatusButtonComponent } from "./components/capability-request/co
     CapabilityRequestComponent,
     RequestHeaderComponent,
     RunningStatusButtonComponent,
+    CapabilityDefinitionComponent,
   ],
   imports: [CommonModule, WorkspacesRoutingModule, ReactiveFormsModule, FormsModule],
 })