How do you build a subscription selector like Swaptop.nl in WooCommerce?

Hello everyone?

I am currently working on a refurbished laptop webshop (similar to Swaptop.nl) and I’m trying to figure out how to get a clean subscription selector like theirs.

Here is a screenshot of their product page

https://preview.redd.it/m9pcacfgugyf1.png?width=2494&format=png&auto=webp&s=1801accc1b3779a2a6a1d4205187ec0937f8509d

? What I really like about it:
– The clear subscription options (Flexible, 1 year, 2 years, 3 years)
– The monthly price shown on the right
– The bonus highlight on the last subscription (“Free laptop case + wireless mouse”)
– It appears to be directly integrated with WooCommerce product variants

I’m trying to recreate this inside WooCommerceand I’m wondering what the best technical approach is for this.

These are the options I have considered so far:
1️⃣ WooCommerce subscriptions (official plugin)
2️⃣ YITH WooCommerce subscription

3️⃣ Custom HTML/CSS/JS formatting on top of variable products

My goal is to create something that is not only beautiful, but also scalable: something that can handle recurring payments (Stripe/Mollie) and future upgrades/downgrades.

? Has anyone here built a similar setup or seen a clean implementation?

I’d love to hear your thoughts on the tech stack, plugin recommendations, or UI/UX structure for these types of subscription flows.

Thank you in advance?

–Jackson
(I’m building TipTopLaptop.nl and ActionCraft.nl – mainly WooCommerce & Laravel dev stuff)