diff --git a/angular-primeng-app/src/app/components/post-details/post-details.component.html b/angular-primeng-app/src/app/components/post-details/post-details.component.html
index a257841..0c15d42 100644
--- a/angular-primeng-app/src/app/components/post-details/post-details.component.html
+++ b/angular-primeng-app/src/app/components/post-details/post-details.component.html
@@ -7,13 +7,19 @@ <h1 class="title">{{ post.title }}</h1>
         <div class="author-info">
           @if (isTeam) {
             <p-avatarGroup styleClass="mb-3" >
-               <p-avatar [image]="post.author.profilePicture" size="large" shape="circle" title="{{ post.author.name}}"></p-avatar>
+               <a href="https://hashnode.com/@{{post.author.name | removeSpecialChars}}" target="_blank">
+               <p-avatar [image]="post.author.profilePicture" size="large" shape="circle" title="{{post.author.name}}"></p-avatar>
+               </a>
                @for (coAuthor of post.coAuthors; track coAuthor.username) {
-                 <p-avatar [image]="coAuthor.profilePicture" size="large"  shape="circle" title="{{ coAuthor.username}}"></p-avatar>
+                <a href="https://hashnode.com/@{{coAuthor.username | removeSpecialChars }}" target="_blank">
+                <p-avatar [image]="coAuthor.profilePicture" size="large"  shape="circle" title="{{coAuthor.username}}"></p-avatar>
+                </a>
                 }
             </p-avatarGroup>
           } @else {
-             <p-avatar [image]="post.author.profilePicture" size="large"  shape="circle" title="{{ post.author.name}}"></p-avatar>
+            <a href='https://hashnode.com/@{{post.author.name | removeSpecialChars}}' target="_blank">
+             <p-avatar [image]="post.author.profilePicture" size="large"  shape="circle" title="{{post.author.name}}"></p-avatar>
+            </a>
             }
           <div class="author-text">
             <span class="author-name">{{post.author.name}} {{isTeam && post.coAuthors.length > 0 ? 'with ' + post.coAuthors.length + ' co-author' + (post.coAuthors.length > 1 ? 's' : '') : ''}}</span>
diff --git a/angular-primeng-app/src/app/components/post-details/post-details.component.ts b/angular-primeng-app/src/app/components/post-details/post-details.component.ts
index 03ca9bd..e35ef34 100644
--- a/angular-primeng-app/src/app/components/post-details/post-details.component.ts
+++ b/angular-primeng-app/src/app/components/post-details/post-details.component.ts
@@ -20,6 +20,7 @@ import { ButtonModule } from "primeng/button";
 import { InputSwitchModule } from "primeng/inputswitch";
 import { AvatarModule } from 'primeng/avatar';
 import { AvatarGroupModule } from 'primeng/avatargroup';
+import { RemoveSpecialCharsPipe  } from "../../pipes/special-characters-remover.pipe";
 
 @Component({
 	selector: "app-post-details",
@@ -40,6 +41,7 @@ import { AvatarGroupModule } from 'primeng/avatargroup';
 		SearchDialogComponent,
 		AvatarGroupModule,
 		AvatarModule,
+		RemoveSpecialCharsPipe 
 	],
 	templateUrl: "./post-details.component.html",
 	styleUrl: "./post-details.component.scss",
diff --git a/angular-primeng-app/src/app/pipes/special-characters-remover.pipe.spec.ts b/angular-primeng-app/src/app/pipes/special-characters-remover.pipe.spec.ts
new file mode 100644
index 0000000..6f814b6
--- /dev/null
+++ b/angular-primeng-app/src/app/pipes/special-characters-remover.pipe.spec.ts
@@ -0,0 +1,9 @@
+import { RemoveSpecialCharsPipe  } from "./special-characters-remover.pipe"
+
+describe("RemoveSpecialCharsPipe ",()=>{
+    const pipe = new RemoveSpecialCharsPipe ()
+    
+    it('should transform and return a string with no curly brackets and no spaces',()=>{
+        expect(pipe.transform('{{name}} ')).toBe('name');
+    })
+})
\ No newline at end of file
diff --git a/angular-primeng-app/src/app/pipes/special-characters-remover.pipe.ts b/angular-primeng-app/src/app/pipes/special-characters-remover.pipe.ts
new file mode 100644
index 0000000..fab2f8c
--- /dev/null
+++ b/angular-primeng-app/src/app/pipes/special-characters-remover.pipe.ts
@@ -0,0 +1,13 @@
+import { Pipe, PipeTransform } from "@angular/core";
+
+@Pipe({
+    name: 'removeSpecialChars',
+    standalone: true
+})
+
+export class RemoveSpecialCharsPipe  implements PipeTransform{
+    transform(value: string) : string {
+        return value.replace(/[{()}]/g, "").trim();
+    }
+
+}
\ No newline at end of file