---
title: "Ticket Button — Free Framer component · Best of Framer"
description: "Free Framer component · by Dony Alhadi · Buttons. Split-on-hover ticket button"
canonical: "https://framer.elliotli.dev/component/ticket-button"
---

[Home](/)/[Components](/components)/[Buttons](/components/category/buttons)/Ticket Button

# Ticket Button

Split-on-hover ticket button

[View on Framer](https://framer.com/marketplace/components/ticket-button/?via=elliot-li)

![Ticket Button preview image 1](https://framer.elliotli.dev/og/component/ticket-button/ed312eb754571124/1600x1200.jpg)

## Summary

Split-on-hover ticket button

## Description

This component is designed to turn a simple call-to-action into a more engaging interaction. Inspired by the tactile feel of a real ticket, the button features a split-on-hover effect where the text and icon subtly separate, creating a sense of anticipation and making the interaction feel more intentional.

Built with flexibility in mind, you can easily adapt it to fit your design system or brand style. The component comes with customizable properties, allowing you to control the content and appearance without touching the core interaction.

### Customizable properties

-   **Button Title** — Update the main label to match your context
    
-   **Background Color (Default & Hover)** — Adjust colors for both states to fit your brand
    
-   **Link Target** — Set the destination URL for the button action
    

### Notes

For a more realistic ticket feel, make sure to match the dash (perforation) color with your default background color. This small detail helps maintain the illusion when the button splits on hover.

Share your build

If you build something cool with it, post it in X and tag me [@donyalhadi.](https://x.com/donyalhadi) I’d love to see what you create!

## Rank history [How rankings work →](/terms#rankings)

-   All · #6625

## Details

- **Author**: Dony Alhadi
- **Published**: 2026-04-25
- **Updated**: 2026-04-25
- **Added**: 2026-04-16
- **Categories**: Buttons

## More like this

-   [Liquid Blob Button](/component/liquid-blob-button) — Oddframe · Free — Interactive Liquid Blob CTA Button
-   [Pixel Face Toggle](/component/pixel-face-toggle) — Zac Nielson · $9 — Dark mode switch with a pixel face
-   [Liquid Hover Media](/component/liquid-hover-media) — Bardia Madani · $5 — Fluid media distortion on hover
-   [Eye Glow Button](/component/eye-glow-button) — Frame Native · Free — Cursor-following eyes, soft glow