diff --git a/web/src/components/buttons/BlueskyButton.tsx b/web/src/components/buttons/BlueskyButton.tsx
new file mode 100644
index 0000000000..d31543035d
--- /dev/null
+++ b/web/src/components/buttons/BlueskyButton.tsx
@@ -0,0 +1,46 @@
+import { Button, ButtonProps } from 'components/Button';
+import { useTranslation } from 'react-i18next';
+import { FaBluesky } from 'react-icons/fa6';
+import { ShareType, trackShare } from 'utils/analytics';
+import { baseUrl, DEFAULT_ICON_SIZE } from 'utils/constants';
+
+interface BlueskyButtonProps
+  extends Omit<
+    ButtonProps,
+    'icon' | 'children' | 'href' | 'onClick' | 'backgroundClasses' | 'foregroundClasses'
+  > {
+  iconSize?: number;
+  isIconOnly?: boolean;
+  isShareLink?: boolean;
+}
+const trackBlueskyShare = trackShare(ShareType.BLUESKY);
+
+export function BlueskyButton({
+  isIconOnly,
+  iconSize = DEFAULT_ICON_SIZE,
+  isShareLink,
+  ...restProps
+}: BlueskyButtonProps) {
+  const { t } = useTranslation();
+
+  return (
+    <Button
+      backgroundClasses="bg-[#1185fe]"
+      foregroundClasses="text-white dark:text-white focus-visible:outline-[#1185fe]"
+      href={
+        isShareLink
+          ? `https://bsky.app/intent/compose?text=${t('button.bluesky-share', {
+              baseUrl,
+            })}`
+          : undefined
+      }
+      onClick={isShareLink ? trackBlueskyShare : undefined}
+      icon={<FaBluesky size={iconSize} />}
+      {...restProps}
+    >
+      {isIconOnly
+        ? undefined
+        : t(isShareLink ? 'button.Bluesky-share' : 'button.Bluesky')}
+    </Button>
+  );
+}
diff --git a/web/src/features/panels/ranking-panel/SocialIcons.tsx b/web/src/features/panels/ranking-panel/SocialIcons.tsx
index 47b8501288..eaef39c3aa 100644
--- a/web/src/features/panels/ranking-panel/SocialIcons.tsx
+++ b/web/src/features/panels/ranking-panel/SocialIcons.tsx
@@ -1,3 +1,4 @@
+import { BlueskyButton } from 'components/buttons/BlueskyButton';
 import { FacebookButton } from 'components/buttons/FacebookButton';
 import { FeedbackButton } from 'components/buttons/FeedbackButton';
 import { LinkedinButton } from 'components/buttons/LinkedinButton';
@@ -14,6 +15,7 @@ export default function SocialIconRow() {
         <h3>{t('info.share-app')}</h3>
         <LinkedinButton isIconOnly size="sm" type="link" isShareLink />
         <RedditButton isIconOnly size="sm" type="link" isShareLink />
+        <BlueskyButton isIconOnly size="sm" type="link" isShareLink />
         <TwitterButton isIconOnly size="sm" type="link" isShareLink />
         <FacebookButton isIconOnly size="sm" type="link" isShareLink />
       </section>
diff --git a/web/src/locales/en.json b/web/src/locales/en.json
index f00d4f7629..b8f29c22e4 100644
--- a/web/src/locales/en.json
+++ b/web/src/locales/en.json
@@ -16,6 +16,7 @@
     "no-results": "No results found for this search 🌍"
   },
   "button": {
+    "bluesky-share": "Check real-time global electricity emissions data: {{baseUrl}}",
     "reddit": "Join r/electricitymaps",
     "reddit-share": "Share on Reddit",
     "github": "Contribute on GitHub",
diff --git a/web/src/utils/analytics.ts b/web/src/utils/analytics.ts
index 905ef2daa9..f475f40275 100644
--- a/web/src/utils/analytics.ts
+++ b/web/src/utils/analytics.ts
@@ -30,6 +30,7 @@ export enum ShareType {
   FACEBOOK = 'facebook',
   LINKEDIN = 'linkedin',
   TWITTER = 'twitter',
+  BLUESKY = 'bluesky',
   REDDIT = 'reddit',
   COPY = 'copy',
   SHARE = 'share',