diff --git a/frontend/src/assets/icons/bell.svg b/frontend/src/assets/icons/bell.svg
new file mode 100644
index 0000000..28c4e8a
--- /dev/null
+++ b/frontend/src/assets/icons/bell.svg
@@ -0,0 +1,3 @@
+
diff --git a/frontend/src/assets/icons/user.svg b/frontend/src/assets/icons/user.svg
new file mode 100644
index 0000000..3f0c997
--- /dev/null
+++ b/frontend/src/assets/icons/user.svg
@@ -0,0 +1,3 @@
+
diff --git a/frontend/src/components/Header/index.stories.tsx b/frontend/src/components/Header/index.stories.tsx
new file mode 100644
index 0000000..4bce462
--- /dev/null
+++ b/frontend/src/components/Header/index.stories.tsx
@@ -0,0 +1,12 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Header from './index';
+
+const meta: Meta = {
+ title: 'Components/Header',
+ component: Header,
+};
+
+export default meta;
+type Story = StoryObj;
+
+export const Default: Story = {};
diff --git a/frontend/src/components/Header/index.tsx b/frontend/src/components/Header/index.tsx
new file mode 100644
index 0000000..54b067d
--- /dev/null
+++ b/frontend/src/components/Header/index.tsx
@@ -0,0 +1,48 @@
+import * as React from 'react';
+import { cn } from '@/lib/utils';
+import bellIcon from '@/assets/icons/bell.svg';
+import userIcon from '@/assets/icons/user.svg';
+
+export interface HeaderProps extends React.HTMLAttributes {}
+
+export default function Header({ className, ...props }: HeaderProps) {
+ return (
+
+
+
+ WorLabel
+
+
+
+
+
+
+
+
+ );
+}