# CSS - Change fonts on standard slider

**URL:** <https://community.elfsight.com/t/css-change-fonts-on-standard-slider/8697>\
**Category:** Customization\
**Tags:** slider\
**Created:** [November 24, 2022, 8:28am UTC](https://community.elfsight.com/t/css-change-fonts-on-standard-slider/8697 "2022-11-24T08:28:55Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Will](https://avatars.discourse-cdn.com/v4/letter/w/90ced4/32.png) [@Will](https://community.elfsight.com/u/Will)\
**Post date:** [November 24, 2022, 8:28am UTC](https://community.elfsight.com/t/css-change-fonts-on-standard-slider/8697/1 "2022-11-24T08:28:55Z")

</div>

Hi,

Does anyone know the CSS to change title and text fonts in the standard slider? I have found it for the testimonials slider, but can’t find CSS anywhere for the standard slider. Have checked all over!

Thanks

---

<div class="post-metadata">

**Author:** ![Helga](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/helga/32/1155_2.png) [@Helga](https://community.elfsight.com/u/Helga)\
**Post date:** [November 24, 2022, 9:06am UTC](https://community.elfsight.com/t/css-change-fonts-on-standard-slider/8697/2 "2022-11-24T09:06:03Z")

</div>

Hi @Will, welcome to the community, very happy to have you join us! 🤗

This CSS code should help, please try to add it to your widget Custom CSS section:

```auto
.eapp-slider-badge-component{
    font-size: 24px;
    color: red;
}
.eapp-slider-title-component{
    font-size: 34px;
    color: red;
}
.eapp-slider-text-component{
    font-size: 19px;
    color: green;
}
.eapp-slider-button-link{
    font-size: 19px;
    color: yellow;
}

```

Please let me know if it worked 🙂

---

<div class="post-metadata">

**Author:** ![Will](https://avatars.discourse-cdn.com/v4/letter/w/90ced4/32.png) [@Will](https://community.elfsight.com/u/Will)\
**Post date:** [November 24, 2022, 11:35am UTC](https://community.elfsight.com/t/css-change-fonts-on-standard-slider/8697/3 "2022-11-24T11:35:04Z")

</div>

Hey Helga, thanks so much for the fast response! This is great, I was also wanting to change the font so it matches brand fonts on the website - is this possible?

Thanks,  
Will

---

<div class="post-metadata">

**Author:** ![Masha](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/masha/32/1771_2.png) [@Masha](https://community.elfsight.com/u/Masha)\
**Post date:** [November 24, 2022, 1:13pm UTC](https://community.elfsight.com/t/css-change-fonts-on-standard-slider/8697/5 "2022-11-24T13:13:23Z")

</div>

Hi Will,

You can add the following code if you want to use the same font for all slider elements:

```auto
.eapp-slider-slide-elements {
    font-family: Arial;
}

```

Alternatively, you could add `font-family` to each element in the code Helga gave you:

```auto
.eapp-slider-badge-component {
    font-size: 24px;
    color: red;
    font-family: Arial;
}

```

Let me know if it helps!

---

<div class="post-metadata">

**Author:** ![Will](https://avatars.discourse-cdn.com/v4/letter/w/90ced4/32.png) [@Will](https://community.elfsight.com/u/Will)\
**Post date:** [November 24, 2022, 2:44pm UTC](https://community.elfsight.com/t/css-change-fonts-on-standard-slider/8697/7 "2022-11-24T14:44:46Z")

</div>

Amazing, thanks Masha - and thanks Helga. Great community, you rock! Cheers

---

<div class="post-metadata">

**Author:** ![Helga](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/helga/32/1155_2.png) [@Helga](https://community.elfsight.com/u/Helga)\
**Post date:** [November 24, 2022, 2:47pm UTC](https://community.elfsight.com/t/css-change-fonts-on-standard-slider/8697/8 "2022-11-24T14:47:37Z")

</div>

Any time, Will! 😍

---

<div class="post-metadata">

**Author:** ![user17612](https://avatars.discourse-cdn.com/v4/letter/u/839c29/32.png) [@user17612](https://community.elfsight.com/u/user17612)\
**Post date:** [November 14, 2024, 4:29am UTC](https://community.elfsight.com/t/css-change-fonts-on-standard-slider/8697/9 "2024-11-14T04:29:18Z")

</div>

Hello, is there a way I can change the font to Oswald? Thank you!

---

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [November 14, 2024, 10:43am UTC](https://community.elfsight.com/t/css-change-fonts-on-standard-slider/8697/10 "2024-11-14T10:43:14Z")

</div>

Welcome to the Community, @user17612 👋

This code should help:

```auto
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Oswald:wght@200..700&display=swap');

.eapp-slider-slider-component {
  font-family: Oswald;
}

```

  

Please add it to the Custom CSS field on the Advanced tab of your widget’s settings and let me know if it worked 🙂