MIT App Inventor 2 Dark Mode

Since there seems to be a trend everyone want Dark Mode, Just did a simple css change to APP INVENTOR 2 bringing Dark Mode to APP Inventor, i would like to share it !

I am going to attach the source code too :
AppInventor2DarkModeUnofficial.zip.aia (15.1 KB)
Please rename it to .zip as i cant upload zip here so i renamed it to aia

8 Likes

I really need dark mode feature in mitapp invertor, plz mitapp team add this feature.

3 Likes

We could simply add a function at the setting dropdown called “Dark Mode” and import the dark mode css file using that function

3 Likes

yes, dark mode does not stress our eyes much at night.

3 Likes

Please add this feature to ai2 settings! The “Dark Reader” chrome extension does not work properly with app inventor.

2 Likes

Thanks hybro for sharing. I don't know where to place yours css files. Can you help me? thanks and regards

1 Like

GO to appengine/war/static/css And after your change, run ant or ant noplay ( As u wish) and then restart your server by closing the powershell window and reopening and runing java_dev_appserver --port=8888 --address=0.0.0.0 appengine/build/war/

1 Like

Looks great, just what I was looking for...I just don't know how to implement it!

2 Likes

I got it! thanks

2 Likes

Hi. Can I use this css file with my extension? because i need to toggle light and dark mode feature on it :slight_smile:

umm there is no change just the colours are changed you can get any dark color combination from web i guess?

are you asking for code to toggle or just permanent dark mode?

1 Like

no i am not asking for any code. i was just asking for permission that i can use this css code on my extension or not.

and yes if you can help me with this i will be very grateful to you :slight_smile:

not sure i can really do right now i am not coding till my exams end

It is open that means you can but still better to ask permission.

1 Like

yeah you're right but hopefully the css owner doesnt tell me anything now! :sweat_smile:

i also have my exams due to commence from Monday. Good luck! :wink:

2 Likes

Seems like it'll be a tad bit hard to do so, especially since...

image
(from OP's summary)

2 Likes

Wow that's the thing i have been looking for since i joined App inventor!

Arnav Tiwari

1 Like

I'm not sure if you can use CSS files in Chrome extensions.

1 Like

yes I can use it. I learnt it few days ago actually. If you know JavaScript. you can implement it easily :wink:

very nice feature it helps protecting eyes , thank you

1 Like

Hello, I don't know how to add this if anyone could help. Thanks

1 Like