Free tool

Booksy button generator

Paste your Booksy business link and copy a "Book on Booksy" button for your website, in your colors.

<a href="https://booksy.com/en-us/123456_your-shop_barber-shop_12345_houston" target="_blank" rel="noopener" style="display:inline-flex;align-items:center;gap:8px;box-sizing:border-box;font-family:inherit;font-size:15px;font-weight:600;line-height:1.2;white-space:nowrap;cursor:pointer;min-height:40px;padding:8px 18px;border-radius:999px;text-decoration:none;color:#ffffff;background:#1f1e1d;border:1.5px solid #1f1e1d"><svg width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7.5 3v15.5"/><circle cx="12" cy="14" r="4.5"/></svg>Book on Booksy</a>

Add a booking button to my website where it fits best (the header, the contact section or the footer). Use this exact HTML:

<a href="https://booksy.com/en-us/123456_your-shop_barber-shop_12345_houston" target="_blank" rel="noopener" style="display:inline-flex;align-items:center;gap:8px;box-sizing:border-box;font-family:inherit;font-size:15px;font-weight:600;line-height:1.2;white-space:nowrap;cursor:pointer;min-height:40px;padding:8px 18px;border-radius:999px;text-decoration:none;color:#ffffff;background:#1f1e1d;border:1.5px solid #1f1e1d"><svg width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7.5 3v15.5"/><circle cx="12" cy="14" r="4.5"/></svg>Book on Booksy</a>

Rules:
- Keep the link exactly https://booksy.com/en-us/123456_your-shop_barber-shop_12345_houston.
- Match my site's fonts and spacing; the colors and shape can stay as they are.
- If my site uses React, Next.js, Vue, Svelte or Astro, convert it to that framework's syntax (style objects in JSX).
- If there is a script tag and my site does not allow outside scripts, leave it out: the button still works as a plain link.

Find your Booksy link

Open your business profile on booksy.com and copy the address from the browser. It looks like booksy.com/en-us/123456_your-shop_barber-shop_12345_houston. In the Booksy Biz app, the share option on your profile gives you the same link.

Paste it above. The tool recognizes it, switches the label to "Book on Booksy" and adds the icon.

How to add the Booksy button to your site

Paste your link and pick the words, style, size and color.
Copy the HTML.
Paste it on your website, near the top of the page: clients come to book, so make it the first thing they see.

The button is one plain link with its styles written inline, so it needs no stylesheet, plugin or account, and it looks the same wherever you paste it. If you build with an AI assistant, "Copy for AI" gives you a short prompt with the code in it, ready for Claude, ChatGPT or Cursor.

Where it works

Any site that lets you add HTML:

WordPress: add a Custom HTML block.
Squarespace: add a Code block.
Wix: Add, Embed code, Embed HTML.
Webflow: add an Embed element.
Shopify: a Custom Liquid section, or the HTML view of a page.
Carrd and Framer: an Embed element.

Email is different: most email apps drop custom code, so use the email signature generator for that.

Questions

Is this made by Booksy?

No. It is a free tool from makerhandle that makes a plain link to your Booksy page. Booksy also offers its own booking widget for websites.

Can I put my Booksy calendar on my link in bio?

Yes, on makerhandle. Paste your Booksy link into the booking block and clients can see your services and book without leaving your page.

Does it work on Instagram?

Instagram does not allow buttons in bios, only links. Put your Booksy link, or a page that holds it, in your bio link.

Is it free?

Yes, with no account. Nothing you type is saved.