CINXE.COM
How to turn your household pet into a Firefox theme - Firefox Add-ons Blog
<!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>How to turn your household pet into a Firefox theme - Firefox Add-ons Blog</title> <link href="/blog/assets/fonts/woff2/Inter-roman-subset-en_de_fr_ru_es_pt_pl_it.var.a04ad982.woff2" crossorigin="anonymous" rel="preload" as="font" type="font/woff2"> <meta name="robots" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1"> <link rel="canonical" href="https://addons.mozilla.org/blog/how-to-turn-your-household-pet-into-a-firefox-theme/"> <meta property="og:locale" content="en_US"> <meta property="og:type" content="article"> <meta property="og:title" content="How to turn your household pet into a Firefox theme - Firefox Add-ons Blog"> <meta property="og:description" content="Themes are a fun way to change the visual appearance of Firefox and give the browser a look that’s all your own. You’re free to explore more than a half-million community created themes on addons.mozilla.org (AMO), or better yet, create your own custom theme. Best of all — create a theme featuring a beloved pet! […]"> <meta property="og:url" content="https://addons.mozilla.org/blog/how-to-turn-your-household-pet-into-a-firefox-theme/"> <meta property="og:site_name" content="Firefox Add-ons Blog"> <meta property="article:published_time" content="2024-10-17T22:54:56+00:00"> <meta property="article:modified_time" content="2024-10-17T22:54:58+00:00"> <meta property="og:image" content="https://mozamo.wpengine.com/wp-content/uploads/2024/10/tootsie_hero_final-scaled.jpg"> <meta property="og:image:width" content="2560"> <meta property="og:image:height" content="1920"> <meta property="og:image:type" content="image/jpeg"> <meta name="author" content="Scott DeVaney"> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:label1" content="Written by"> <meta name="twitter:data1" content="Scott DeVaney"> <meta name="twitter:label2" content="Est. reading time"> <meta name="twitter:data2" content="3 minutes"> <script type="application/ld+json" class="yoast-schema-graph">{"@context":"https://schema.org","@graph":[{"@type":"WebPage","@id":"https://addons.mozilla.org/blog/how-to-turn-your-household-pet-into-a-firefox-theme/","url":"https://addons.mozilla.org/blog/how-to-turn-your-household-pet-into-a-firefox-theme/","name":"How to turn your household pet into a Firefox theme - Firefox Add-ons Blog","isPartOf":{"@id":"https://addons.mozilla.org/blog/#website"},"primaryImageOfPage":{"@id":"https://addons.mozilla.org/blog/how-to-turn-your-household-pet-into-a-firefox-theme/#primaryimage"},"image":{"@id":"https://addons.mozilla.org/blog/how-to-turn-your-household-pet-into-a-firefox-theme/#primaryimage"},"thumbnailUrl":"https://mozamo.wpengine.com/wp-content/uploads/2024/10/tootsie_hero_final-scaled.jpg","datePublished":"2024-10-17T22:54:56+00:00","dateModified":"2024-10-17T22:54:58+00:00","author":{"@id":"https://addons.mozilla.org/blog/#/schema/person/390a5a9ae4c0f3e1c1112fc35c920f50"},"breadcrumb":{"@id":"https://addons.mozilla.org/blog/how-to-turn-your-household-pet-into-a-firefox-theme/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https://addons.mozilla.org/blog/how-to-turn-your-household-pet-into-a-firefox-theme/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https://addons.mozilla.org/blog/how-to-turn-your-household-pet-into-a-firefox-theme/#primaryimage","url":"https://mozamo.wpengine.com/wp-content/uploads/2024/10/tootsie_hero_final-scaled.jpg","contentUrl":"https://mozamo.wpengine.com/wp-content/uploads/2024/10/tootsie_hero_final-scaled.jpg","width":2560,"height":1920},{"@type":"BreadcrumbList","@id":"https://addons.mozilla.org/blog/how-to-turn-your-household-pet-into-a-firefox-theme/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://addons.mozilla.org/blog/"},{"@type":"ListItem","position":2,"name":"How to turn your household pet into a Firefox theme"}]},{"@type":"WebSite","@id":"https://addons.mozilla.org/blog/#website","url":"https://addons.mozilla.org/blog/","name":"Firefox Add-ons Blog","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://addons.mozilla.org/blog/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https://addons.mozilla.org/blog/#/schema/person/390a5a9ae4c0f3e1c1112fc35c920f50","name":"Scott DeVaney","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https://addons.mozilla.org/blog/#/schema/person/image/","url":"https://secure.gravatar.com/avatar/dc38a62432c7d12585390805c2bc58e2?s=96&d=mm&r=g","contentUrl":"https://secure.gravatar.com/avatar/dc38a62432c7d12585390805c2bc58e2?s=96&d=mm&r=g","caption":"Scott DeVaney"},"url":"https://addons.mozilla.org/blog/author/sdevaney/"}]}</script> <link rel="shortcut icon" href="/blog/assets/img/favicon.7674e1ad.ico"> <link rel="alternate" type="application/atom+xml" title="Firefox Add-ons Blog RSS Feed" href="/blog/feed.xml"> <link rel="stylesheet" href="/blog/assets/css/styles.7eeebaca.css"> </head> <body data-base-api-url="https://addons.mozilla.org"> <header class="header" style="background-image: url('https://mozamo.wpengine.com/wp-content/uploads/2024/10/tootsie_hero_final-scaled.jpg');"> <div class="header-overlay"> <div class="header-wrapper"> <a class="header-logo" href="/"> <span class="visually-hidden">Firefox Browser Add-ons</span> </a> <h1 class="header-title"> How to turn your household pet into a Firefox theme </h1> </div> </div> </header> <main aria-label="Content"><div class="blogpost"> <nav class="blogpost-breadcrumb" aria-label="breadcrumbs"> <ol> <li> <a href="/">Add-ons</a> </li> <li> <a href="/blog/">Firefox Add-ons Blog</a> </li> <li> <a href="/blog/how-to-turn-your-household-pet-into-a-firefox-theme/" aria-current="location">How to turn your household pet into a Firefox theme</a> </li> </ol> </nav> <div class="blogpost-content"> <div class="blogpost-content-wrapper"> <p><strong>Themes</strong> are a fun way to change the visual appearance of Firefox and give the browser a look that’s all your own. You’re free to explore more than a half-million <a rel="noreferrer noopener" href="https://addons.mozilla.org/firefox/themes/">community created themes</a> on <em>addons.mozilla.org</em> (AMO), or better yet, create your own custom theme. Best of all — create a theme featuring a beloved pet! Then you can take your little buddy with you wherever you go on the web. </p> <p><em><em>(You’ll need a </em><a rel="noreferrer noopener" href="https://www.mozilla.org/account/"><em>Mozilla account</em></a><em> to create and publish Firefox themes on AMO.)</em></em></p> <h2 class="wp-block-heading"><strong>Prepare your pet pic for upload</strong></h2> <p>I find it helpful to first size my image properly. For Firefox themes, we recommend images with a height between 100 – 200 pixels. So I might first prepare an image with a couple of sizing options, perhaps one at 100 pixel height and another at 200, and see what works best. (Note: as you resize an image, be sure its height and width parameters change in sync so your image maintains proper dimensions.)</p> <figure class="wp-block-image size-large"><img sizes="(max-width: 1024px) 100vw, 1024px" srcset="https://mozamo.wpengine.com/wp-content/uploads/2024/10/tootsie1-1024x718.jpg 1024w, https://mozamo.wpengine.com/wp-content/uploads/2024/10/tootsie1-300x210.jpg 300w, https://mozamo.wpengine.com/wp-content/uploads/2024/10/tootsie1-768x539.jpg 768w, https://mozamo.wpengine.com/wp-content/uploads/2024/10/tootsie1.jpg 1490w" class="wp-image-344" alt="Tootsie strikes a pose to become a Firefox theme." src="https://mozamo.wpengine.com/wp-content/uploads/2024/10/tootsie1-1024x718.jpg" height="718" width="1024" decoding="async" loading="lazy"><figcaption class="wp-element-caption"><em>Tootsie strikes a pose to become a Firefox theme. </em></figcaption></figure> <p>Depending on what type of image editing software you have on your computer (PC users can resize pics with the standard Photo or Paint apps, while Mac users may be familiar with Preview), find the controls to resize and save your images in the recommended range. Supported file formats include PNG, JPG, APNG, SVG, or GIF (not animated) and can be up to 6.9MB. </p> <h2 class="wp-block-heading"><strong>Upload your pet pic & select custom colors</strong></h2> <p>Go to AMO’s <a rel="noreferrer noopener" href="https://addons.mozilla.org/developers/addon/submit/wizard-listed?utm_source=extensionworkshop.com&utm_medium=referral&utm_content=using-amo-generator">Theme Generator</a> page and…</p> <ul class="wp-block-list"> <li>Name your theme</li> <li>Upload your image</li> <li>Select colors for the header background, text and icons</li> </ul> <figure class="wp-block-image size-large"><img sizes="(max-width: 1024px) 100vw, 1024px" srcset="https://mozamo.wpengine.com/wp-content/uploads/2024/10/theme-generator-1024x936.jpg 1024w, https://mozamo.wpengine.com/wp-content/uploads/2024/10/theme-generator-300x274.jpg 300w, https://mozamo.wpengine.com/wp-content/uploads/2024/10/theme-generator-768x702.jpg 768w, https://mozamo.wpengine.com/wp-content/uploads/2024/10/theme-generator.jpg 1444w" class="wp-image-348" alt="" src="https://mozamo.wpengine.com/wp-content/uploads/2024/10/theme-generator-1024x936.jpg" height="936" width="1024" decoding="async" loading="lazy"><figcaption class="wp-element-caption"><em>Point-and-click color palettes make it easy to create complementary color combinations. </em></figcaption></figure> <p>Once you like the way your new theme looks in the preview display, click Finish Theme and you’re done! All new theme submissions must first pass a review process, but that usually only takes a day or two, after which you’ll receive an email notifying you that your personalized pet theme is ready to install on Firefox. Now <a rel="noreferrer noopener" href="https://addons.mozilla.org/firefox/addon/tootsie-girl/">Tootsie accompanies me everywhere online</a>, although <a rel="noreferrer noopener" href="https://addons.mozilla.org/firefox/addon/tootsie-stares/">sometimes she just stares</a> at me. </p> <p>For more tips on creating Firefox themes, please see this <a rel="noreferrer noopener" href="https://extensionworkshop.com/documentation/themes/using-the-amo-theme-generator/">Theme Generator guide</a> or visit the <a rel="noreferrer noopener" href="https://extensionworkshop.com/documentation/themes/">Extension Workshop</a>. </p> </div> </div> <aside class="blogpost-sidebar"> <dl class="blogpost-meta"> <div class="blogpost-meta-updated"> <dt class="updated">Updated</dt> <dd class="updated">October 17, 2024</dd> </div> <div class="blogpost-meta-author"> <dt class="author">By</dt> <dd class="author">Scott DeVaney</dd> </div> <div class="blogpost-meta-avatar"> <dt class="author-avatar visually-hidden">Avatar</dt> <dd class="author-avatar"><img src="https://secure.gravatar.com/avatar/dc38a62432c7d12585390805c2bc58e2?s=96&d=mm&r=g"></dd> </div> <div class="blogpost-meta-share-social"> <dt class="share-social">Share</dt> <dd class="share-social"> <a class="share-twitter-link" href="https://twitter.com/intent/tweet/?text=How%20to%20turn%20your%20household%20pet%20into%20a%20Firefox%20theme&url=https%3A%2F%2Faddons.mozilla.org%2Fblog%2Fhow-to-turn-your-household-pet-into-a-firefox-theme%2F?utm_source%3Dtwitter%26utm_medium%3Dsocial%26utm_campaign%3Damo_blog_share"> Twitter </a> <a class="share-pocket-link" href="https://widgets.getpocket.com/v1/popup?url=https%3A%2F%2Faddons.mozilla.org%2Fblog%2Fhow-to-turn-your-household-pet-into-a-firefox-theme%2F"> Pocket </a> </dd> </div> </dl> </aside> </div> </main> <nav class="blogpost-nav"> <ol> <li class="blogpost-nav-next blogpost-nav-no-prev"> <a href="/blog/fakespot-your-friend-in-the-fight-against-unreliable-reviews/"> <span>Next article</span> <p>Fakespot — your friend in the fight against unreliable reviews</p> <time datetime="2024-06-27T23:13:32">June 27, 2024</time> <svg class="blogpost-nav-arrow-right" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23.62 43"> <defs><style>.cls-1{fill:none;stroke:#000;stroke-linecap:round;stroke-miterlimit:10;stroke-width:3px;}</style></defs> <polyline class="cls-1" points="1.5 1.5 21.5 21.5 1.5 41.5"></polyline> </svg> </a> </li> </ol> </nav> <footer class="Footer"><div class="Footer-wrapper"><div class="Footer-mozilla-link-wrapper"><a title="Go to Mozilla's homepage" href="https://mozilla.org/" class="Footer-mozilla-link"><span class="Icon Icon-mozilla Footer-mozilla-logo"><span class="visually-hidden">Go to Mozilla's homepage</span></span></a></div><section class="Footer-amo-links"><h4 class="Footer-links-header"><a href="/en-US/firefox/">Add-ons</a></h4><ul class="Footer-links"><li><a href="/en-US/about">About</a></li><li><a href="/blog/" class="Footer-blog-link">Firefox Add-ons Blog</a></li><li><a href="https://extensionworkshop.com/?utm_content=footer-link&utm_medium=referral&utm_source=addons.mozilla.org" class="Footer-extension-workshop-link">Extension Workshop</a></li><li><a href="/en-US/developers/">Developer Hub</a></li><li><a href="https://extensionworkshop.com/documentation/publish/add-on-policies/?utm_medium=photon-footer&utm_source=addons.mozilla.org" class="Footer-developer-policies-link">Developer Policies</a></li><li><a href="https://blog.mozilla.com/addons?utm_content=footer-link&utm_medium=referral&utm_source=addons.mozilla.org" class="Footer-community-blog-link">Community Blog</a></li><li><a href="https://discourse.mozilla-community.org/c/add-ons">Forum</a></li><li><a href="https://developer.mozilla.org/docs/Mozilla/Add-ons/Contact_us" class="Footer-bug-report-link">Report a bug</a></li><li><a href="/en-US/review_guide">Review Guide</a></li></ul></section><section class="Footer-browsers-links"><h4 class="Footer-links-header">Browsers</h4><ul class="Footer-links"><li><a href="https://www.mozilla.org/firefox/new/?utm_content=footer-link&utm_medium=referral&utm_source=addons.mozilla.org" class="Footer-desktop-link">Desktop</a></li><li><a href="https://www.mozilla.org/firefox/mobile/?utm_content=footer-link&utm_medium=referral&utm_source=addons.mozilla.org" class="Footer-mobile-link">Mobile</a></li><li><a href="https://www.mozilla.org/firefox/enterprise/?utm_content=footer-link&utm_medium=referral&utm_source=addons.mozilla.org" class="Footer-enterprise-link">Enterprise</a></li></ul></section><section class="Footer-product-links"><h4 class="Footer-links-header">Products</h4><ul class="Footer-links"><li><a href="https://www.mozilla.org/firefox/browsers/?utm_content=footer-link&utm_medium=referral&utm_source=addons.mozilla.org" class="Footer-browsers-link">Browsers</a></li><li><a href="https://www.mozilla.org/products/vpn/?utm_content=footer-link&utm_medium=referral&utm_source=addons.mozilla.org#pricing" class="Footer-vpn-link">VPN</a></li><li><a href="https://relay.firefox.com/?utm_content=footer-link&utm_medium=referral&utm_source=addons.mozilla.org" class="Footer-relay-link">Relay</a></li><li><a href="https://monitor.firefox.com/?utm_content=footer-link&utm_medium=referral&utm_source=addons.mozilla.org" class="Footer-monitor-link">Monitor</a></li><li><a href="https://getpocket.com?utm_content=footer-link&utm_medium=referral&utm_source=addons.mozilla.org" class="Footer-pocket-link">Pocket</a></li></ul><ul class="Footer-links Footer-links-social"><li class="Footer-link-social"><a href="https://twitter.com/firefox"><span class="Icon Icon-twitter"><span class="visually-hidden">Twitter (@firefox)</span></span></a></li><li class="Footer-link-social"><a href="https://www.instagram.com/firefox/"><span class="Icon Icon-instagram"><span class="visually-hidden">Instagram (Firefox)</span></span></a></li><li class="Footer-link-social"><a href="https://www.youtube.com/firefoxchannel"><span class="Icon Icon-youtube"><span class="visually-hidden">YouTube (firefoxchannel)</span></span></a></li></ul></section><ul class="Footer-legal-links"><li><a href="https://www.mozilla.org/privacy/websites/" class="Footer-privacy-link">Privacy</a></li><li><a href="https://www.mozilla.org/privacy/websites/" class="Footer-cookies-link">Cookies</a></li><li><a href="https://www.mozilla.org/about/legal/terms/mozilla/" class="Footer-legal-link">Legal</a></li></ul><p class="Footer-copyright">Except where otherwise <a href="https://www.mozilla.org/en-US/about/legal/">noted</a>, content on this site is licensed under the <a href="https://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution Share-Alike License v3.0</a> or any later version.</p></div></footer> <script src="/blog/assets/js/bundle.0f90b1b2.js"></script> </body> </html>