3 files changed, 71 insertions, 0 deletions
diff --git a/src/components/atoms/images/icons/hamburger-icon/hamburger-icon.module.scss b/src/components/atoms/images/icons/hamburger-icon/hamburger-icon.module.scss
new file mode 100644
index 0000000..8b8ad7e
--- /dev/null
+++ b/src/components/atoms/images/icons/hamburger-icon/hamburger-icon.module.scss
@@ -0,0 +1,45 @@
+@use "../../../../../styles/abstracts/functions" as fun;
+
+.wrapper {
+  display: flex;
+  align-items: center;
+  aspect-ratio: 1/1;
+  position: relative;
+}
+
+.icon {
+  width: 100%;
+
+  &,
+  &::before,
+  &::after {
+    display: block;
+    height: 20%;
+    background: var(--color-primary-lighter);
+    background-image: linear-gradient(
+      to right,
+      var(--color-primary-light) 0%,
+      var(--color-primary-lighter) 100%
+    );
+    border: fun.convert-px(1) solid var(--color-primary-darker);
+    border-radius: fun.convert-px(4);
+    transition:
+      all 0.25s ease-in-out 0s,
+      transform 0.4s ease-in 0s;
+  }
+
+  &::before,
+  &::after {
+    content: "";
+    position: absolute;
+    inset-inline: 0;
+  }
+
+  &::before {
+    top: 3%;
+  }
+
+  &::after {
+    bottom: 3%;
+  }
+}
diff --git a/src/components/atoms/images/icons/hamburger-icon/hamburger-icon.tsx b/src/components/atoms/images/icons/hamburger-icon/hamburger-icon.tsx
new file mode 100644
index 0000000..edd25ba
--- /dev/null
+++ b/src/components/atoms/images/icons/hamburger-icon/hamburger-icon.tsx
@@ -0,0 +1,25 @@
+import type { FC, HTMLAttributes } from 'react';
+import styles from './hamburger-icon.module.scss';
+
+export type HamburgerIconProps = Omit<
+  HTMLAttributes<HTMLSpanElement>,
+  'children'
+>;
+
+/**
+ * HamburgerIcon component
+ *
+ * Render a Hamburger icon.
+ */
+export const HamburgerIcon: FC<HamburgerIconProps> = ({
+  className = '',
+  ...props
+}) => {
+  const wrapperClass = `${styles.wrapper} ${className}`;
+
+  return (
+    <span {...props} className={wrapperClass}>
+      <span className={styles.icon} />
+    </span>
+  );
+};
diff --git a/src/components/atoms/images/icons/hamburger-icon/index.ts b/src/components/atoms/images/icons/hamburger-icon/index.ts
new file mode 100644
index 0000000..a601d0c
--- /dev/null
+++ b/src/components/atoms/images/icons/hamburger-icon/index.ts
@@ -0,0 +1 @@
+export * from './hamburger-icon';