diff --git a/modules/blox-tailwind/layouts/_shortcodes/button.html b/modules/blox-tailwind/layouts/_shortcodes/button.html
new file mode 100644
index 00000000..67b370d7
--- /dev/null
+++ b/modules/blox-tailwind/layouts/_shortcodes/button.html
@@ -0,0 +1,166 @@
+{{/*
+  Button Shortcode for Hugo Blox Builder
+  
+  Docs: https://docs.hugoblox.com/content/writing-markdown-latex/
+  
+  Parameters
+  ----------
+  url : required
+      Button destination URL (internal or external)
+  text : optional
+      Button text content (overrides .Inner)
+  new_tab : optional, default false
+      Whether to open link in new tab:
+      - false: Open in same tab (default)
+      - true: Open in new tab
+  style : optional, default "primary"
+      Button style variant:
+      - "primary": Primary gradient (default)
+      - "secondary": Secondary gradient
+      - "outline": Outlined style
+      - "ghost": Minimal ghost style
+  size : optional, default "md"
+      Button size:
+      - "sm": Small button
+      - "md": Medium button (default)
+      - "lg": Large button
+      - "xl": Extra large button
+  align : optional, default "left"
+      Button alignment on page:
+      - "left": Left-aligned (default)
+      - "center": Center-aligned
+      - "right": Right-aligned
+  icon : optional
+      Icon name to display alongside text
+  icon_position : optional, default "left"
+      Icon position relative to text:
+      - "left": Icon before text (default)
+      - "right": Icon after text
+  rounded : optional, default "md"
+      Button border radius:
+      - "sm": Small radius
+      - "md": Medium radius (default)
+      - "lg": Large radius
+      - "xl": Extra large radius
+      - "full": Fully rounded (pill shape)
+  disabled : optional, default false
+      Whether button should be disabled
+  
+  Examples
+  --------
+  {{< button url="/contact" >}}Contact Us{{< /button >}}
+  {{< button url="https://example.com" new_tab="true" style="secondary" >}}External Link{{< /button >}}
+  {{< button url="/download" text="Download Now" icon="download" style="primary" size="lg" align="center" >}}
+  {{< button url="#section" style="outline" rounded="full" icon="arrow-right" icon_position="right" >}}Learn More{{< /button >}}
+*/}}
+
+{{- $url := .Get "url" | default "#" -}}
+{{- $text := .Get "text" | default (.Inner | markdownify | plainify) -}}
+{{- $newTab := .Get "new_tab" | default false -}}
+{{- $style := .Get "style" | default "primary" -}}
+{{- $size := .Get "size" | default "md" -}}
+{{- $align := .Get "align" | default "left" -}}
+{{- $icon := .Get "icon" -}}
+{{- $iconPosition := .Get "icon_position" | default "left" -}}
+{{- $rounded := .Get "rounded" | default "md" -}}
+{{- $disabled := .Get "disabled" | default false -}}
+
+{{/* Set target and rel attributes based on new_tab parameter */}}
+{{- $targetAttr := "" -}}
+{{- $relAttr := "" -}}
+{{- $isExternal := or (strings.HasPrefix $url "http://") (strings.HasPrefix $url "https://") -}}
+
+{{- if $newTab -}}
+  {{- $targetAttr = "_blank" -}}
+  {{- if $isExternal -}}
+    {{- $relAttr = "noopener noreferrer" -}}
+  {{- else -}}
+    {{- $relAttr = "noopener" -}}
+  {{- end -}}
+{{- else if $isExternal -}}
+  {{- $relAttr = "noreferrer" -}}
+{{- end -}}
+
+{{/* Alignment classes */}}
+{{- $alignClass := "" -}}
+{{- if eq $align "center" -}}
+  {{- $alignClass = "text-center" -}}
+{{- else if eq $align "right" -}}
+  {{- $alignClass = "text-right" -}}
+{{- else -}}
+  {{- $alignClass = "text-left" -}}
+{{- end -}}
+
+{{/* Size classes */}}
+{{- $sizeClasses := "" -}}
+{{- if eq $size "sm" -}}
+  {{- $sizeClasses = "px-3 py-1.5 text-sm" -}}
+{{- else if eq $size "lg" -}}
+  {{- $sizeClasses = "px-6 py-3 text-lg" -}}
+{{- else if eq $size "xl" -}}
+  {{- $sizeClasses = "px-8 py-4 text-xl" -}}
+{{- else -}}
+  {{- $sizeClasses = "px-4 py-2 text-base" -}}
+{{- end -}}
+
+{{/* Rounded classes */}}
+{{- $roundedClass := "" -}}
+{{- if eq $rounded "sm" -}}
+  {{- $roundedClass = "rounded" -}}
+{{- else if eq $rounded "lg" -}}
+  {{- $roundedClass = "rounded-xl" -}}
+{{- else if eq $rounded "xl" -}}
+  {{- $roundedClass = "rounded-2xl" -}}
+{{- else if eq $rounded "full" -}}
+  {{- $roundedClass = "rounded-full" -}}
+{{- else -}}
+  {{- $roundedClass = "rounded-lg" -}}
+{{- end -}}
+
+{{/* Style classes */}}
+{{- $styleClasses := "" -}}
+{{- $baseClasses := "inline-flex items-center gap-2 font-medium no-underline transition-all duration-300 ease-out transform-gpu focus:outline-none focus:ring-4 focus:ring-offset-2 focus:ring-offset-white dark:focus:ring-offset-zinc-900 disabled:opacity-50 disabled:cursor-not-allowed disabled:pointer-events-none" -}}
+
+{{- if eq $style "secondary" -}}
+  {{- $styleClasses = "bg-gradient-to-br from-secondary-500 to-secondary-600 hover:from-secondary-600 hover:to-secondary-700 active:from-secondary-700 active:to-secondary-800 text-white shadow-lg shadow-secondary-500/25 hover:shadow-xl hover:shadow-secondary-500/30 hover:scale-105 active:scale-95 focus:ring-secondary-500/50" -}}
+{{- else if eq $style "outline" -}}
+  {{- $styleClasses = "bg-white dark:bg-zinc-900 border-2 border-primary-500 text-primary-600 dark:text-primary-400 hover:bg-primary-50 dark:hover:bg-primary-950/50 hover:border-primary-600 active:bg-primary-100 dark:active:bg-primary-950 shadow-md hover:shadow-lg hover:scale-105 active:scale-95 focus:ring-primary-500/50" -}}
+{{- else if eq $style "ghost" -}}
+  {{- $styleClasses = "bg-transparent text-primary-600 dark:text-primary-400 hover:bg-primary-50 dark:hover:bg-primary-950/50 active:bg-primary-100 dark:active:bg-primary-950 hover:scale-105 active:scale-95 focus:ring-primary-500/50" -}}
+{{- else -}}
+  {{/* Primary gradient (default) */}}
+  {{- $styleClasses = "bg-gradient-to-br from-primary-500 to-primary-600 hover:from-primary-600 hover:to-primary-700 active:from-primary-700 active:to-primary-800 text-white shadow-lg shadow-primary-500/25 hover:shadow-xl hover:shadow-primary-500/30 hover:-translate-y-0.5 hover:scale-[1.02] active:scale-[0.98] focus:ring-primary-500/50" -}}
+{{- end -}}
+
+{{/* Generate unique ID for button */}}
+{{ $id := delimit (slice "button" (partial "functions/uid.html" .)) "-" }}
+
+<div class="{{ $alignClass }}">
+  <a
+    id="{{ $id }}"
+    href="{{ $url }}"
+    {{ with $targetAttr }}target="{{ . }}"{{ end }}
+    {{ with $relAttr }}rel="{{ . }}"{{ end }}
+    {{ with $disabled }}{{ if . }}disabled aria-disabled="true"{{ end }}{{ end }}
+    class="{{ $baseClasses }} {{ $styleClasses }} {{ $sizeClasses }} {{ $roundedClass }}"
+    role="button"
+    {{ with $text }}aria-label="{{ . | plainify }}"{{ end }}
+  >
+    {{/* Icon before text */}}
+    {{ if and $icon (eq $iconPosition "left") }}
+      <span class="flex-shrink-0">
+        {{ partial "functions/get_icon" (dict "name" $icon "attributes" "class=\"w-4 h-4\"") }}
+      </span>
+    {{ end }}
+    
+    {{/* Button text */}}
+    <span>{{ $text }}</span>
+    
+    {{/* Icon after text */}}
+    {{ if and $icon (eq $iconPosition "right") }}
+      <span class="flex-shrink-0">
+        {{ partial "functions/get_icon" (dict "name" $icon "attributes" "class=\"w-4 h-4\"") }}
+      </span>
+    {{ end }}
+  </a>
+</div>