# Twitter Logo for Bootstrap Icons

## Brought to you by Simon Köhler

With this CSS snippet, you can use the new Twitter X logo in your project as long as the Bootstrap team has not added an official icon. The only downside: it's a quick and temporary solution, and therefore you have to resize the icon manually. The default size is 16x16 pixels.

### HTML Markup

You can use the icon just like any other Bootstrap Icon:

     <i class="bi-twitter-x"></i>

Inverted Icon:

     <i class="bi-twitter-x inverted"></i>

Sizing Icons:

     <i class="bi-twitter-x fs-1"></i>
     <i class="bi-twitter-x fs-2"></i>
     <i class="bi-twitter-x fs-3"></i>

Icons in Headlines:

     <h1><i class="bi-twitter-x"></i> Header Text</h1>
     <h2><i class="bi-twitter-x"></i> Header Text</h2>
     <h3><i class="bi-twitter-x"></i> Header Text</h3>

### Example: Regular Buttons with Icons

### Example: Large Buttons with Icons

You only have to adjust the height to 20px when icon is inside of a large button. See CSS code.

### Example: Using Bootstrap Font Sizes

The icon is set to a fixed font size, when placed inside of a container with the bootstrap font size classes. See CSS for more details.

H1 Font Size (fs-1)
H2 Font Size (fs-2)
H3 Font Size (fs-3)
H4 Font Size (fs-4)