Buttons
A modern, customizable button shortcode with gradient styling, icons, and smart link handling.
Basic Usage
The above buttons are created with:
{{< button url="/contact" >}}Contact Us{{< /button >}}
{{< button url="https://example.com" new_tab="true" style="secondary" >}}Visit External Site{{< /button >}}
Style Variants
Primary (Default)
{{< button url="#" style="primary" >}}Primary Button{{< /button >}}
Secondary
{{< button url="#" style="secondary" >}}Secondary Button{{< /button >}}
Outline
{{< button url="#" style="outline" >}}Outline Button{{< /button >}}
Ghost
{{< button url="#" style="ghost" >}}Ghost Button{{< /button >}}
Sizes
Small
Medium (Default)
Large
Extra Large
{{< button url="#" size="sm" >}}Small Button{{< /button >}}
{{< button url="#" size="md" >}}Medium Button{{< /button >}}
{{< button url="#" size="lg" >}}Large Button{{< /button >}}
{{< button url="#" size="xl" >}}Extra Large{{< /button >}}
Alignment
Left (Default)
Center
Right
{{< button url="#" align="left" >}}Left Aligned{{< /button >}}
{{< button url="#" align="center" >}}Center Aligned{{< /button >}}
{{< button url="#" align="right" >}}Right Aligned{{< /button >}}
With Icons
Icon Before Text
Icon After Text
{{< button url="#" icon="arrow-down-tray" >}}Download{{< /button >}}
{{< button url="#" icon="arrow-right" icon_position="right" >}}Continue{{< /button >}}
Rounded Corners
Small Radius
Medium Radius (Default)
Large Radius
Pill Shape
{{< button url="#" rounded="sm" >}}Small Radius{{< /button >}}
{{< button url="#" rounded="md" >}}Medium Radius{{< /button >}}
{{< button url="#" rounded="lg" >}}Large Radius{{< /button >}}
{{< button url="#" rounded="full" >}}Pill Button{{< /button >}}
Advanced Examples
Call-to-Action Button
{{< button url="/signup" style="primary" size="lg" align="center" icon="rocket-launch" >}}Get Started Today{{< /button >}}
External Link with New Tab
{{< button url="https://github.com/hugo-blox/kit" new_tab="true" style="outline" icon="arrow-top-right-on-square" icon_position="right" >}}View on GitHub{{< /button >}}
Download Button
{{< button url="/files/document.pdf" style="secondary" icon="document-arrow-down" rounded="full" >}}Download PDF{{< /button >}}
Parameters
| Parameter | Type | Default | Description |
|---|---|---|---|
url | string | # | Required. Button destination URL (internal or external) |
text | string | Inner content | Button text (overrides shortcode content) |
new_tab | boolean | false | Whether to open link in new tab |
style | string | primary | Button style: primary, secondary, outline, ghost |
size | string | md | Button size: sm, md, lg, xl |
align | string | left | Button alignment: left, center, right |
icon | string | - | Icon name from Hero Icons |
icon_position | string | left | Icon position: left, right |
rounded | string | md | Border radius: sm, md, lg, xl, full |
disabled | boolean | false | Whether button should be disabled |
Security Features
The button shortcode automatically handles security for external links:
- External links get
rel="noreferrer"attribute - External links opening in new tab get
rel="noopener noreferrer" - Internal links opening in new tab get
rel="noopener"
This ensures safe navigation while maintaining functionality.
Accessibility
The button shortcode includes built-in accessibility features:
- Proper
role="button"attribute aria-labelsupport- Keyboard focus indicators
- High contrast focus rings
- Disabled state handling
My research combines machine learning and signal processing with geometric methods to study time series and dynamical systems.
Since March 2025, I have been a postdoctoral researcher at CMAP - Ecole Polytechnique, working with Karim Lounici and Rémi Flamary. My work combines operator learning and optimal transport to compare dynamical systems, uncover shared dynamical structure, and transfer knowledge across systems.
Previously, I completed my PhD at Centre Borelli, under the supervision of Charles Truong and Laurent Oudre. I developed methods tailored for the discovery and statistical analysis of time series patterns with a particular focus on biomedical applications.