Dark mode for planner web application

Latest Version

Version
2.4
Update
March 3, 2022
Size
65.18KiB
Developer
Category
Users
1,000+
Rating
4.07692 ★
Manifest Version
2
Web Store Status
Languages Support
English
See more
Permissions
*://tasks.office.com/*
See more

Dark Theme for Planner Web App Extension

Welcome to Dark Theme for Microsoft Planner

You can switch between dark mode and site default theme by clicking on the extension icon.

I would appreciate your comments and feedback for improving the extension regularly.

Thanks for checking out!!!

Update 2.4
- Changed Column Title colors

Update 2.3
- Changing extension name for compliance issue

Update 2.2
- Changing logo due to complaince issue

Update 2.1
- fixed whitebox text on pageload
- Theme will be on a delayed load of 2s

Update 2.0
- fixed popup background color updates

Update 1.9
- fix for popup dialog updates

Update 1.8
- minor bug fix on colors

Update 1.7
- Updated favourite and Chart bugs

Update 1.6
- New Update changes

Update 1.5
- minor changes on task cards

Update 1.4
- Added Shadows for task cards
- Update on changes for new profile menu
- Minor bug fixes

Update 1.3
- Changes for Popup dialog
- Minor bug fixes

Update 1.2
- Now theme gets applied by default on page load
- User can now switch between themes by clicking on the extension icon

Update 1.1
- Changed the theme from black contrast to grey mode
- minor bug fixes

Github Repo:
https://github.com/AmirthaRajan/MicrosoftPlannerDarkTheme
Read more

Source Manifest.json

{"update_url": "https://clients2.google.com/service/update2/crx", "name": "Dark Theme for Planner Web App", "manifest_version": 2, "version": "2.4", "description": "Dark mode for planner web application", "background": { "matches" : ["*://tasks.office.com/*"], "scripts": ["background.js"] }, "content_scripts":[ { "matches" : [ "*://tasks.office.com/*"], "js" : ["jquery.min.js","delay_load.js"], "run_at": "document_end" } ], "icons": { "16": "icon16.png", "48": "icon48.png", "128": "icon128.png"}, "browser_action": { "name": "Change Theme", "default_icon": "icon128.png" , "default_title": "Toggle theme mode" }, "permissions": [ "*://tasks.office.com/*"]} "
Read more

How to download and manually install Dark Theme for Planner Web App extension for Chrome

Looking for a way to install Dark Theme for Planner Web App extensions for Chrome, you can search for them in the Chrome Web Store, clicking the "Add to Chrome" button, and following the straightforward process.

However, you may need to install Dark Theme for Planner Web App extensions manually, this article outlines two simple methods to effortlessly install Dark Theme for Planner Web App extensions, whether they come as unpacked folders in compressed formats like .zip or as .crx files.

Method 1: Download Dark Theme for Planner Web App extension and manually install through Drag &Drop

If you ever need to manually install a Dark Theme for Planner Web App extension for Chrome, don't worry, it's a simple process. Just follow these easy steps, and you will have your extension ready to use in no time.

Step 1: Download the Dark Theme for Planner Web App Extension by clicking the "Download CRX" button on the website.

Look for the Dark Theme for Planner Web App extension you wish to install. Go to the website and download the Dark Theme for Planner Web App extension package, which is usually a .CRX file and comes in a zipped file. Here ".crx" file is the format for Dark Theme for Planner Web App extension that contains all the data.

Step 2: Extract &Arrange Files

Once the file is downloaded, extract that file into its own folder. Similarly, give that extension files a permanent home. In other words, keep it in a folder that you don't accidentally delete it because these files will be needed to make that extension work.

Step 3: Go to the Chrome Extensions Page

Open Google Chrome and in the address bar, type chrome://extensions; it will open the Google Chrome extensions page. Make sure that "My extensions" is selected in the sidebar.

Step 4: Drag and Drop the Extension

Now, go to the folder where you extracted the Dark Theme for Planner Web App extension and drag &drop the extension file from there anywhere onto the extension page within Google Chrome.

Step 5: Complete the Installation

Once you drag and drop the extension file, follow the steps that Google Chrome takes you through. Similarly, if the extension file is of .crx file format, you will be required to review the permissions and then add the extension.

Now, you can manage that added extension as you would like to with any other Chrome extension that you added through Chrome Webstore. Its icon will also appear in the Google Chrome Menu on the right side of the address bar once you activate it.

Method 2: Download Dark Theme for Planner Web App extension for Chrome and install in Developer Mode

This is another method to install Dark Theme for Planner Web App extension manually, but the twist is that here, you install by enabling the developer mode option provided in Google Chrome. This mode is commonly used for testing extensions or running unpublished tools.

Step 1: Download the Dark Theme for Planner Web App extension file

Select and download the Dark Theme for Planner Web App extension by clicking the 'Download CRX' button on the website.

Step 2: Extract the downloaded contents

Convert the file to a ZIP file if it is in CRX format then extract the Dark Theme for Planner Web App extension zip file or folder that you downloaded. Make sure you extract it using the same folder name and keep it safely in another folder, so you don't delete it by mistake. The extracted folder will be needed to keep your Dark Theme for Planner Web App extension running.

Step 3: Open Chrome Extension Setting Page

In the address bar of Google Chrome, type chrome://extensions and open the Chrome Extension Page.

Step 4: Enable Developer Mode

After opening the Chrome Extension page, look at the top right side, and you will find the toggle option of "Developer mode."Simply enable that developer mode option.

Step 5: Load the Unpacked Extension

Once you enable the developer mode option, you will see the menu of Load Unpacked, Pack Extensions and Update. From that, select the option "Load unpacked."

Step 6: Select the Extension Folder

Once the pop-up opens upon clicking Load unpacked, select the Dark Theme for Planner Web App extension directory and click on the "Select Folder "button.

Step 7: Confirm and Install

After you select an extension folder of a Google Chrome extension you're installing manually, confirm its installation for the final time and let the installation complete.

Conclusion

Here we've made a step-by-step guide on How to manually install Dark Theme for Planner Web App extension in 2 ways. We hope this guide proves helpful.

Similar Extensions

icon

Planner - Dark Mode Extension · Productivity 1,000+ 12 ★ 35.46KiB

icon

NightShifter - Dark Mode and Wallpaper for Planner Extension · Productivity 1,000+ 2 ★ 35.9KiB

icon

Daily Planner Extension · Productivity 1,000+ 13 ★ 15.47MiB

icon

Trello Night Extension · Productivity 1,000+ 47 ★ 23.39KiB

icon

Microsoft Planner Default Extension · Accessibility 1,000+ 0 ★ 97.59KiB

icon

Planner Night Mode Extension · Accessibility 1,000+ 3 ★ 51.23KiB

icon

MS Planner Markdown Extension Extension · Productivity 1,000+ 2 ★ 58.87KiB

icon

Night Mode for Jira Extension · Productivity 1,000+ 126 ★ 703KiB

icon

Bullet Journal - Notes, Lists, Weekly Planner Extension · Productivity 1,000+ 108 ★ 1.2MiB

icon

Add to Microsoft To Do Extension · Productivity 1,000+ 84 ★ 699KiB

icon

Planner Default View Extension · Productivity 1,000+ 18 ★ 109KiB

icon

MS Planner Presenter Extension · Productivity 1,000+ 2 ★ 12.39KiB

icon

Estimations Plugin for Microsoft Planner Extension · Productivity 1,000+ 22 ★ 28.07KiB

icon

Plan - Calendar & Tasks Extension · Productivity 1,000+ 57 ★ 2.27MiB

icon

Shortcuts For Microsoft Extension · Productivity 1,000+ 3 ★ 47.29KiB

icon

Microsoft Power Automate (Legacy) Extension · Productivity 1,000+ 63 ★ 60.87KiB

icon

Polus Extension · Productivity 1,000+ 19 ★ 93.73KiB

icon

Dark Mode for Freshdesk Extension · Productivity 1,000+ 25 ★ 675KiB

icon

Page diagnostics for SharePoint Extension · Productivity 1,000+ 6 ★ 2.54MiB

icon

Dark Mode for Salesforce Extension · Productivity 1,000+ 153 ★ 3.28MiB

icon

Microsoft Power Automate Extension · Productivity 1,000+ 129 ★ 556KiB

icon

Calendar Dark Mode Extension · Productivity 1,000+ 378 ★ 195KiB

icon

IT Glue Chrome Extension Extension · Productivity 1,000+ 59 ★ 3.44MiB

icon

Dark Mode for Outlook Extension · Accessibility 1,000+ 7 ★ 34.11KiB

User reviews

icon

Anna Brandberg (ID: 000000dd652fdf20) Voted 3 ★ - Updated 12/12/2022 This is the only functioning dark mode extension for Planner I could find, but it's quite inconsistent and even a bit broken unfortunately — making illegible in various places. I don't know if the developer is still working on this or not, but I took the liberty of creating a few mock-ups of a more correct colour panel (based on the dark mode version of Microsoft's mobile app) in case it's helpful. I'd be more than happy to update my rating if the extension is updated. Thank you very much! ___ Mockups: - AssignedToMe - Before: https://i.gyazo.com/4787a054a0ae4e9dcd526406ade6b3eb.jpg - AssignedToMe - After: https://i.gyazo.com/9d219fd8bbca34fb54408cac6f8a4eec.jpg - AssignedToMe_Grid - Before: https://i.gyazo.com/cc11efed1df7a9f209638339177ec933.jpg - AssignedToMe_Grid - After: https://i.gyazo.com/39f2b78c35af44a063b6550853e108c3.jpg - Hub - Before: https://i.gyazo.com/75c76eda6db869b870d70b0bf87b4a70.jpg - Hub - After: https://i.gyazo.com/27a70eaae781c5304818875f61a8ae1b.jpg - Group - Before: https://i.gyazo.com/1e58f4446101837358474d855af467a3.jpg - Group - After: https://i.gyazo.com/2db01ff2d331f29e928236ebbb71b877.jpg - EditTask - Before: https://i.gyazo.com/5dcab7e8a222b95067692c80e30962df.jpg - EditTask - After: https://i.gyazo.com/27df6dc9d6d96ce4fd260dede4d42cdd.jpg

icon

Ben Malkin (ID: 000000054112b580) Voted 4 ★ - Updated 07/07/2022 I liked the other planner dark mode app better. This one is more jarring on the eyes. Edit: I stopped using Planner for a bit, but now I've started again. I really like this extension now. It's not perfect since the text in the navigation pane is almost the same color as the background, but the tasks section looks really good.

icon

Gerry Corcoran (ID: 000000f92a832eaf) Voted 5 ★ - Updated 04/25/2022 Fantastic extension that gives the feature Microsoft won't for some reason. So much nicer to use Planner without your eyes burning. Great job!

icon

Willy Lin (ID: 0000004c9ccef69b) Voted 4 ★ - Updated 10/12/2021 Works well. Thanks! However, the color of checklist and attachment icon are too dark. Maybe you can change them to white?

icon

Thomas Nobbe (ID: 000000be12c955a7) Voted 5 ★ - Updated 03/05/2021 Great work, I love dark themes :-). I had an issue that everything was black/dark like you would assume but all the cards would show in white-ish glow and was unable to read the conversations. Was able to get it back to work by removing and adding the extension again! FYI