Roblox Studio Theme

Roblox Studio Theme is - you guessed it - based off of Roblox Studio’s default dark mode theme.

2 Likes

Nice! Is there also a light mode? (I know I’m a monster)

2 Likes

Hmm I’ll consider making one (but it will purposely look ugly)

2 Likes

TBH actually a good theme

1 Like

Ay thanks! It probably looks best in Lua
TYSM for the tip BTW!

1 Like

Light mode haz been made.

https://replit.com/theme/@QwertyQwerty54/roblox-studio-light

1 Like

copy right???

Bro it’s just a theme…

1 Like

roblox doesn’t own the color white.

2 Likes

Turns out a user named @jwklong already made both a dark mode and a light mode based off of Roblox Studio but I think mine is more accurate, lol.

Very cool! I’m on Roblox Studio a lot, so this definitely gives me more of a familiar feeling when going on Replit instead of Studio’s IDE.

This gives me an idea: Let’s see if I can make a Custom Studio theme that matches Replit’s dark theme :eyes:

1 Like

Fun! I actually want to be a Roblox dev

1 Like

Roblox studio seems more customizable than Replit, so totally go for it! Too bad you can’t share them on studio though.

1 Like

Do you happen to know where I can the hex colors for replit’s dark theme so I don’t to find each of them manually?

1 Like

replit.css by @hecker40 (this dude makes @Bookie0 level stuff, and trust me, @Bookie0 is crazy good with CSS.)

Here's the colors (though I'd recommend just checking them in the Repl)
:root {
  --font-family: 'IBM Plex Sans', sans-serif;
  --background-root: #0E1525;
  --background-default: #1C2333;
  --background-higher: #2B3245;
  --background-highest: #3C445C;
  --background-overlay: #0e1525A0;
  --foreground-default: #F5F9FC;
  --foreground-dimmer: #C2C8CC;
  --foreground-dimmest: #9DA2A6;
  --outline-dimmest: #2B3245;
  --outline-dimmer: #3C445C;
  --outline-default: #4E5569;
  --outline-stronger: #5F677A;
  --outline-strongest: #70788C;
  --accent-primary-dimmest: #004182;
  --accent-primary-dimmer: #0053A6;
  --accent-primary-default: #0079F2;
  --accent-primary-stronger: #57ABFF;
  --accent-primary-strongest: #B2D9FF;
  --accent-positive-dimmest: #044A10;
  --accent-positive-dimmer: #046113;
  --accent-positive-default: #009118;
  --accent-positive-stronger: #6CD97E;
  --accent-positive-strongest: #BFFFCA;
  --accent-negative-dimmest: #660000;
  --accent-negative-dimmer: #A60808;
  --accent-negative-default: #E52222;
  --accent-negative-stronger: #FF6666;
  --accent-negative-strongest: #FFCFCF;
  --accent-red-dimmest: #660000;
  --accent-red-dimmer: #A60808;
  --accent-red-default: #E52222;
  --accent-red-stronger: #FF6666;
  --accent-red-strongest: #FFCFCF;
  --accent-orange-dimmest: #542A00;
  --accent-orange-dimmer: #703800;
  --accent-orange-default: #AD5700;
  --accent-orange-stronger: #D4781C;
  --accent-orange-strongest: #FFBD7A;
  --accent-yellow-dimmest: #4D4000;
  --accent-yellow-dimmer: #635300;
  --accent-yellow-default: #967D00;
  --accent-yellow-stronger: #BFA730;
  --accent-yellow-strongest: #F2E088;
  --accent-lime-dimmest: #314A00;
  --accent-lime-dimmer: #3D5C00;
  --accent-lime-default: #5A8700;
  --accent-lime-stronger: #87B825;
  --accent-lime-strongest: #C4E581;
  --accent-green-dimmest: #044A10;
  --accent-green-dimmer: #046113;
  --accent-green-default: #009118;
  --accent-green-stronger: #6CD97E;
  --accent-green-strongest: #7AEB8D;
  --accent-teal-dimmest: #004452;
  --accent-teal-dimmer: #006073;
  --accent-teal-default: #0093B0;
  --accent-teal-stronger: #27B9D6;
  --accent-teal-strongest: #69D9F0;
  --accent-blue-dimmest: #004182;
  --accent-blue-dimmer: #0053A6;
  --accent-blue-default: #0079F2;
  --accent-blue-stronger: #57ABFF;
  --accent-blue-strongest: #B2D9FF;
  --accent-purple-dimmest: #39298A;
  --accent-purple-dimmer: #5239CC;
  --accent-purple-default: #795EFF;
  --accent-purple-stronger: #A694FF;
  --accent-purple-strongest: #CEC4FF;
  --accent-magenta-dimmest: #6B1A6B;
  --accent-magenta-dimmer: #8A218A;
  --accent-magenta-default: #C73AC7;
  --accent-magenta-stronger: #F562F5;
  --accent-magenta-strongest: #FFBFFF;
  --accent-pink-dimmest: #6E1B52;
  --accent-pink-dimmer: #8F226B;
  --accent-pink-default: #D4359F;
  --accent-pink-stronger: #FF70CF;
  --accent-pink-strongest: #FFBAE8;
  --accent-grey-dimmest: #404040;
  --accent-grey-dimmer: #545454;
  --accent-grey-default: #808080;
  --accent-grey-stronger: #A6A6A6;
  --accent-grey-strongest: #D4D4D4;
  --accent-brown-dimmest: #594031;
  --accent-brown-dimmer: #75503B;
  --accent-brown-default: #A3765C;
  --accent-brown-stronger: #D49877;
  --accent-brown-strongest: #FFC8A8;
}
3 Likes