# Distributing Font Awesome Icons in Hanami Without Exposing Secrets

**URL:** https://discourse.hanakai.org/t/distributing-font-awesome-icons-in-hanami-without-exposing-secrets/1282
**Category:** sharing
**Created:** [July 25, 2025, 3:33pm UTC](https://discourse.hanakai.org/t/distributing-font-awesome-icons-in-hanami-without-exposing-secrets/1282 "2025-07-25T15:33:15Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![aaronmallen](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.hanakai.org/aaronmallen/32/890_2.png) [@aaronmallen](https://discourse.hanakai.org/u/aaronmallen)
#### Post date: [July 25, 2025, 3:33pm UTC](https://discourse.hanakai.org/t/distributing-font-awesome-icons-in-hanami-without-exposing-secrets/1282/1 "2025-07-25T15:33:15Z")

</div>

Dear Hanami,

@swilgosz recently published a fantastic [Hanami Mastery episode](https://hanamimastery.com/episodes/51-integrate-font-awesome-in-hanami) explaining how to integrate Font Awesome icons using kits. It’s a great tutorial and works well for many use cases.

However, one limitation arises if you’re planning to **distribute your application** or work with **collaborators who can’t share secrets easily**. The default kit-based approach relies on an API token configured in .npmrc, which makes it harder to work across environments securely.

I’d like to offer an alternative approach that still uses Font Awesome kits — but in a **self-hosted, distributable** way.

* * *

### **🛠 Step-by-step: Self-hosting Font Awesome in Hanami**

1. **Create a new kit**

 ![Screenshot 2025-07-25 at 10.16.33 AM](https://canada1.discourse-cdn.com/flex030/uploads/hanamirb/original/1X/a1eee48b000b04944e9263e7c94f2f1e510ee0a7.png)

1. **Choose “Self-Host”**

 ![Screenshot 2025-07-25 at 10.17.34 AM](https://canada1.discourse-cdn.com/flex030/uploads/hanamirb/original/1X/976d9ff37efa532eb0dde7b4f3d4a0f1cb9f8453.png)

1. **Name your kit and save it**

 ![Screenshot 2025-07-25 at 10.18.56 AM](https://canada1.discourse-cdn.com/flex030/uploads/hanamirb/original/1X/7533cace27bb9ed6fe5b0b966da83e9ffb53ec85.png)

1. **Move files into your app**

2. **Import the CSS**  
In app/assets/css/app.css, add:

```auto
@import "fontawesome.css"; 
@import "fontawesome-sharp.css"; /* or whichever file(s) you included */

```

* * *

Now you’re ready to use Font Awesome icons directly in your views:

```auto
<i class="fa-sharp fa-thin fa-envelope"></i>

```

No API keys. No .npmrc hacks. Just awesome icons — fully distributable. Hope this helps anyone looking to bundle Font Awesome in a more portable way!

---

<div class="post-metadata">

### Author: ![swilgosz](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.hanakai.org/swilgosz/32/484_2.png) [@swilgosz](https://discourse.hanakai.org/u/swilgosz)
#### Post date: [July 25, 2025, 5:19pm UTC](https://discourse.hanakai.org/t/distributing-font-awesome-icons-in-hanami-without-exposing-secrets/1282/2 "2025-07-25T17:19:05Z")

</div>

@aaronmallen thanks for contributing!

I have noticed that the link to the episode is not working, as you cut the last letter from URL.

I will add this thread to the epsisode content as a reference!

---

<div class="post-metadata">

### Author: ![aaronmallen](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.hanakai.org/aaronmallen/32/890_2.png) [@aaronmallen](https://discourse.hanakai.org/u/aaronmallen)
#### Post date: [July 25, 2025, 5:20pm UTC](https://discourse.hanakai.org/t/distributing-font-awesome-icons-in-hanami-without-exposing-secrets/1282/3 "2025-07-25T17:20:25Z")

</div>

Thanks for the catch! I fixed it.