# Upload my own fonts

**URL:** <https://forums.concretecms.org/t/upload-my-own-fonts/9922>\
**Category:** Developing with Concrete\
**Tags:** ckeditor\
**Created:** [May 15, 2026, 8:31pm UTC](https://forums.concretecms.org/t/upload-my-own-fonts/9922 "2026-05-15T20:31:53Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Krisnestor](https://forums.concretecms.org/user_avatar/forums.concretecms.org/krisnestor/32/5178_2.png) [@Krisnestor](https://forums.concretecms.org/u/Krisnestor)\
**Post date:** [May 15, 2026, 8:31pm UTC](https://forums.concretecms.org/t/upload-my-own-fonts/9922/1 "2026-05-15T20:31:53Z")

</div>

How can I upload my own fonts or fonts from google?

---

<div class="post-metadata">

**Author:** ![mlocati](https://forums.concretecms.org/user_avatar/forums.concretecms.org/mlocati/32/6208_2.png) [@mlocati](https://forums.concretecms.org/u/mlocati)\
**Post date:** [May 16, 2026, 6:38pm UTC](https://forums.concretecms.org/t/upload-my-own-fonts/9922/2 "2026-05-16T18:38:46Z")

</div>

What do you mean exactly? Upload where?

---

<div class="post-metadata">

**Author:** ![Krisnestor](https://forums.concretecms.org/user_avatar/forums.concretecms.org/krisnestor/32/5178_2.png) [@Krisnestor](https://forums.concretecms.org/u/Krisnestor)\
**Post date:** [May 16, 2026, 8:28pm UTC](https://forums.concretecms.org/t/upload-my-own-fonts/9922/3 "2026-05-16T20:28:22Z")

</div>

How can I link to my own fonts like:   
@import url(‘[https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap](https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap)’);

---

<div class="post-metadata">

**Author:** ![dbuerer](https://forums.concretecms.org/user_avatar/forums.concretecms.org/dbuerer/32/5178_2.png) [@dbuerer](https://forums.concretecms.org/u/dbuerer)\
**Post date:** [June 4, 2026, 12:57pm UTC](https://forums.concretecms.org/t/upload-my-own-fonts/9922/4 "2026-06-04T12:57:19Z")

</div>

I use this tool when i need it - it’s affordable and solves the problem in 38 seconds or less.

> **[Theme Styling Tool](https://market.concretecms.com/products/0ebbad29-d1cd-11ee-b9df-0a97d4ce16b9)**
>
> The Custom CSS add-on is a developer's tool designed to simplify and speed up the process of applying styling adjustments.

This is the CSS I use on one of my sites - it has to be modified a bit based on your active theme but usually not much.

```auto
@import url(‘https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Quicksand:wght@300..700&display=swap’);
@import url(‘https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Quicksand:wght@300..700&display=swap’);
@import url(‘https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Quicksand:wght@300..700&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap’);

div.ccm-page header nav ul a{
font-family: Montserrat;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,
div.ccm-page h1,
div.ccm-page h2,
div.ccm-page h3,
div.ccm-page h4,
div.ccm-page h5,
div.ccm-page h6{
font-family: Raleway;
}

div.ccm-page,
body,
p{
font-family:Inter;
font-size: 1.2rem;
}

```