hello. I want to make this button transparent with a white border around + an animation that starts on hover so the button starts to fill white smooth from left to right. Can someone please help me with this? [silenceclothing_0-1736940386189.png]

Hi @silenceclothing @silenceclothing Go to Online Store → Theme → Edit code. Open your theme.liquid file In theme.liquid, paste the below code before If my reply is helpful, kindly click like and mark it as an accepted solution. Thanks! Use our Big Bulk Discount app to boost your sales! …

did not work. this text comes in the top? [silenceclothing_0-1736941910532.png]

@silenceclothing change your button html first like this: Knappetikett then apply style code : .text { display: inline-block; position: relative; transform: translateX(0); transition: transform 0s ease-in-out, opacity 0s ease-in-out; } .button:hover .text { opacity: 0; /* Hide text…

where do i replace my button html? and where do i insert the other code? also i dont mean the text to move on hover. in mean the text to go from transparent to start filling with color.. for refference, go to : notresucces.com

https://vimeo.com/1047105322/2210b31e8e?share=copy this is how i want it

this is how i want it: https://vimeo.com/1047105322/2210b31e8e?share=copy

this is how i want it https://vimeo.com/1047105322/2210b31e8e?share=copy

@silenceclothing Please provide your store URL If your store is password protected then share the storefront password also. Thanks!

https://xstl3mwcp89lqx6e-65389560005.shopifypreview.com

@silenceclothing Please add the following code to your assets/base.css bottom of the file. .banner__buttons .button:before { box-shadow: none !important; border: 1px solid #fff !important; color: #fff !important; } .banner__buttons .button:after { box-shadow: none !important; …

White border around button + animation

Store Design

silenceclothing January 15, 2025, 2:00pm 28

why is the border and text grey/transparent and not fully white? also, why is there a black line that goes fron and back inside the button?

Topic		Replies	Views
white border around transparent button Store Design design , customizations , css	4	73	January 14, 2025
Change button and border color Store Design design , customizations , css	4	70	February 5, 2025
Customization banner button Store Design design , customizations , landing-page , shopify-themes	4	65	November 20, 2024
How can I change button fill animation across my entire site? Store Design design , customizations , css	7	97	November 13, 2023
Transparent button, with white border smooth transition from left to right when hover Store Design design , customizations , css	6	59	January 10, 2025

White border around button + animation

Related topics