diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/avatar-profile/avatar-profile.component.css b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/avatar-profile/avatar-profile.component.css
index db0a4666..fbc51983 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/avatar-profile/avatar-profile.component.css
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/avatar-profile/avatar-profile.component.css
@@ -1,4 +1,10 @@
 .poster {
+	height: 100%;
+	width: 100%;
+	background-color: #000000;
+}
+
+.initial {
 	position: absolute;
 	display: inline-grid;
     z-index: 1;
diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/avatar-profile/avatar-profile.component.ts b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/avatar-profile/avatar-profile.component.ts
index 65c546a4..cfbfc952 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/avatar-profile/avatar-profile.component.ts
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/avatar-profile/avatar-profile.component.ts
@@ -7,8 +7,10 @@ import { Component, Input } from '@angular/core';
 @Component({
 	selector: 'ov-avatar-profile',
 	template: `
-		<div class="poster" [ngStyle]="{ 'background-color': color }">
-			<span id="poster-text">{{ letter }}</span>
+		<div class="poster">
+			<div class="initial" [ngStyle]="{ 'background-color': color }">
+				<span id="poster-text">{{ letter }}</span>
+			</div>
 		</div>
 	`,
 	styleUrls: ['./avatar-profile.component.css']