How can I add glitter text to my announcement banner?

amonichanel
Excursionist
23 0 6

Hi I would like to add glitter text to my announcement banner and can't seem to figure it out. Is there a code I can use I have a custom announcement bar is there a way to make a custom color font. Like on this website's announcement bar.

 

www.otherland.com

 

Also I am using the Dawn theme.

Replies 4 (4)

ExpertRookie
Shopify Partner
1518 249 314

hi @amonichanel 
To make the function like that
You can try follow this path:
Themes => edit code => asset => base.css
and add this code to bottom of the file base.css

 

/* change background of the section */
.announcement-bar {
background: red;
}
/* set gradient for the message and change font size */
.announcement-bar__message {
font-size: 40px;
color: #fff;
/* this code change the color of the text */
background: linear-gradient(90deg,#f6c526 0%,#fff5c7 25%,#f8e9b6 31%,#e4cb89 41%,#c59a41 56%,#bd8d2e 60%,#ead284 87%,#fff5c7 100%);
  background-clip: border-box;
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
- Was my reply helpful? Please Like and Accept Solution to let me know!
- Want to modify or custom changes on store Hire me.
- Feel free to contact me on expert.rookie.team@gmail.com regarding any help.
amonichanel
Excursionist
23 0 6

Hi the code works perfectly can I meant to be specific and say silver glitter. And is there a way to take off the underline.

ExpertRookie
Shopify Partner
1518 249 314

Hi can you share store url,
If you don't want to publish your info, you can share them to my email

- Was my reply helpful? Please Like and Accept Solution to let me know!
- Want to modify or custom changes on store Hire me.
- Feel free to contact me on expert.rookie.team@gmail.com regarding any help.