Find any Google Font text you like, https://fonts.google.com/. then
To use the Google Fonts you linked for styling the sign-in text, follow these steps:
1. Add the Font to Your CSS
Use the font-family in your .sign-in-text CSS rule:
.sign-in-text {
font-family: "Roboto", sans-serif; /* Example using Roboto */
font-weight: 700; /* Adjust weight between 100 to 900 */
font-size: 24px;
color: #333;
text-align: center;
}
OR using Big Shoulders:
.sign-in-text {
font-family: "Big Shoulders", sans-serif;
font-weight: 300; /* Adjust weight */
font-size: 28px;
color: #007bff;
text-transform: uppercase;
}
2. Ensure the Link is in <head> of Your HTML
Make sure this is inside the <head> section of your HTML:
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Big+Shoulders:opsz,wght@10..72,300&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
3. Apply the Style
Modify the CSS to experiment with different weights and styles.
Let me know if you need more tweaks! 🚀
No comments:
Post a Comment