Skip to Content (Press Enter)
2023-05-24 12-18-44
Mark Joe
175Views
4Comments
Solved
Gradient CSS for background
Question
Reactive
CSS
Application Type
Reactive

Hi,

I want to use Gradient colour  for login page background but i am not able to use it.
can anyone tell me how can use it.


Thanks in advance.

Mark

0
0
25 May 2023
Copy Link
2018-10-29 08-31-03
João Marques
 
MVP
Solution

Hi Mark,


Navigate to https://cssgradient.io/ and define your gradient. When you are finished, get the CSS property:


On Service Studio, set the snippet with the .content class and the copied property, like in the image below:


Kind Regards,
João

2
0
25 May 2023
Copy Link
2023-12-11 08-31-41
Naziya Anjum

Hi Mark,


You can try with this code as well 


body { background: #8e9eabbe; /* fallback for old browsers */ background: -webkit-linear-gradient(to top, #eef2f3, #8e9eab93); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(180deg, #eef2f3, #8e9eab8f); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ }


Hope this helps you.


Thanks and regards


Naziya 

2
0
25 May 2023
Copy Link
UserImage.jpg
Fattah Panuntun

Hi,
i want ask something, how i can add gradient for text? 

0
0
18 May 2024
Copy Link
2024-05-18 23-16-58
Simone Lopes

You can try this 


  • first add a class to apply the style in the text 
  • add the code below changing the color that you need. 


   background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%);    

-webkit-background-clip: text;

  background-clip: text;    -webkit-text-fill-color: transparent;





0
0
18 May 2024
Copy Link
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.