How to Get the Pride Icon on Tumblr

by Irene A. Blake

Tumblr allows you to add different types of custom icons -- stickers, buttons and banners -- to your blog with HTML code. Although Tumblr doesn’t provide specific pride icon codes, many users create icons and share their codes for free. You can find a variety of static and animated icons for your blog that display your pride about a topic, such as a specific religion, philosophy, politics, sexual identity, ethnic heritage, city or country. When you find the right icon, add its code to your blog via Tumblr's theme editor.

Contact the Tumblr blog owner who has a pride icon you like and ask if you can use his code. If you don’t have a specific icon in mind, type “#pride button” or "#pride banner" (without quotation marks) in the Tumblr Search field, and then press “Enter” to see user posts that contain free pride icon codes.

Copy the pride icon code as instructed by the blog owner. Typically, you highlight the code, and then press “Ctrl-C.”

Click the “Customize” button on your blog to access the theme editor, or go to your Dashboard, click the gear icon, select the blog’s name, and then click the “Edit Theme” button.

Add the code to your blog’s theme by pasting it in the Description field or the Add Custom CSS field. To paste it in the Description field, click the field, and then press “Ctrl-V.” To paste it in the Add Custom CSS field, click “Advanced Options” to go to the Advanced screen, click the field, and then press “Ctrl-V.”

Click the “Save” button, and then click the back arrow to return to the main theme editor screen. Click the “Exit” button to close the editor.


If Tumblr Search reveals post results as thumbnail images instead of a list, click the icon marked with three horizontal bars to see the posts in List View. You can also find Tumblr and non-Tumblr blogs that feature free pride icon codes, such as Do You Have Pride?, Got Pride? and PhantasmagoricRS, by performing an online search using "Tumblr" and the related keywords "pride icons,” "pride buttons," "pride stickers" or "pride banners." If you have experience with HTML, add the code directly to your blog theme’s Edit HTML screen as desired. Click “Edit HTML” on the theme editor sidebar to open the Edit HTML screen, paste the code where you want it, click the “Update Preview” button, and then click the “Save” button.


Some icon creators may ask you to copy a generic code, paste it into the theme editor, copy a URL for the icon image, and then paste the URL into the code. Information in this article applies to Tumblr as of January 2014.

More Articles