Add New Monokai Pro Theme #413

kadenbarlow · 2020-02-28T05:02:41Z

I'm pretty new to the emacs community, but started using Doom recently (introduced to it by Doom Themes) and have loved it. I created these three themes for myself that I rotate through depending on my mood. Wondering if any of these are worth adding in?

doom-monokai-pro

edit: removed other two themes

hlissner · 2020-02-28T05:09:33Z

I'm not so sure about atom-dark -- it seems too similar to doom-one or doom-vibrant (both of which are based off of atom one dark). monokai and xcode would be welcome additions though.

ema2159 · 2020-02-28T05:12:17Z

It would be better to create separate PRs though. Did you based the themes on their official palettes?

If I'm not wrong, Monokai was requested quite sometime ago so it would be a great addition. Also, precisely today we were discussing about how we didn't have any pitch black background themes so Xcode would be awesome to have also.

kadenbarlow · 2020-02-28T05:18:07Z

Sure, I'll move doom-xcode to a separate PR.

I based Monokai based on their official palette, except for the different background color which I set darker than what they use.

I couldn't find an official palette for the xcode theme, so I used a tool to inspect xcode and pull the RGB values.

ema2159 · 2020-02-29T02:43:23Z

@kadenbarlow I would think it's better to change Monokai's background to match the original one from the spec, just for the sake of keeping it as similar to the original as possible. I'll test it and use it to check all the faces work ok and that there's no contrast problems. Then if everything's ok I'll merge it! Thanks!

kadenbarlow · 2020-02-29T17:05:11Z

@ema2159 Sounds great. I updated the theme to match the Monokai Pro background and made a couple of other small tweaks so the theme more closely matches Monokai Pro. https://monokai.pro/vscode.

Let me know if any faces need tweaking and I can make changes. Thanks!

ema2159 · 2020-03-02T00:30:37Z

Quick question. Where did you grabbed the colors? Or how did you probed them?

kadenbarlow · 2020-03-02T01:55:33Z

On this site https://monokai.pro/.
MacOS has a digital color meter tool that I used to grab the values. For the actual background color I downloaded the theme in VS Code and inspected it there. There are several different variations of the the site, and I was specifically looking at the pro one.

minikN · 2020-03-04T12:50:25Z

Hi.

What about all the different flavors of monokai-pro? Like Spectrum, Ristretto and so one. I'd love to see them in doom as well. I could create PR's for them if you'd like me to.

ema2159 · 2020-03-04T13:45:26Z

Go ahead! We're reviewing this current one so it may take some time

minikN · 2020-03-04T17:16:38Z

Go ahead! We're reviewing this current one so it may take some time

Hi @ema2159 . I've created a first "beta". It's not ready for a PR yet. However, seems to be I am too stupid to even load the theme properly. I've added

(package! doom-monokai-pro-spectrum-theme
  :recipe (:host github :repo "minikN/doom-emacs-monokai-pro-spectrum"))

into my packages.el and (setq doom-theme 'doom-monokai-pro-theme) into my config.el.

This is what I get: condition-case: Error in a Doom startup hook: doom-init-theme-h, (error "Unable to find theme file for ‘doom-monokai-pro-theme’")

After looking @ @kadenbarlow theme. I suspect it's not quite accurate. As far as I know every Monokai Pro flavor/filter only provides 6 colors (Apart from black to white of course): red, yellow, orange, green, purple, cyan.

For example for the spectrum filter that would be:
#fc618d - red
#7bd88f - green
#fd9353 - orange
#fce566 - yellow
#948ae3 - purple
#5ad4e6 - cyan

As far as I know every other color is just a darkened/lightened variant of the above, like this one:

So I'm wondering where @kadenbarlow got his colors from especially pink and red as there should be only one of the two.

Cheers.

minikN · 2020-03-04T17:18:46Z

themes/doom-monokai-pro-theme.el

+   (type           light-blue)
+   (strings        yellow)
+   (variables      orange)
+   (numbers        yellow)


Numbers should be violet, not yellow, see:

minikN · 2020-03-04T17:24:00Z

themes/doom-monokai-pro-theme.el

+   (operators      pink)
+   (type           light-blue)
+   (strings        yellow)
+   (variables      orange)


Variables should just be white. Function/method parameters are orange when declaring a function. But not variables itself.

Sometimes it's a little bit more difficult given that themes sometimes vary between modes (languages) and Emacs doesn't provide a robust API for that matter. I'll find some time to review this properly a the weekend.

That's true. However, at least for JS and PHP, Monokai Pro doesn't vary in regards to variables.

I think the main problem is that major modes don't support the depth of customization some themes require. I only have experience with php-mode in regards to Monokai Pro. For example the concatenation operator (.) can't be fontified with what php-mode offers at the moment. I've actually submitted two PRs (594, 606). The latter is being reviewed right now. With those two PRs merged, flexibility with how php syntax can be fontified will be greatly improved.

However I don't know what the state of other major modes is.

kadenbarlow · 2020-03-05T03:44:13Z

@minikN You'll notice that red is used for the vc-deleted face, not for any of the syntax highlighting. I think that red is a good indicator of deleted lines in version control and green is good for additions in version control. Also, I agree with @ema2159 It can be hard to get a consistent look across different modes. I tried to get a good balance of matching Monokai and getting a good contrast between colors in the different modes that I tried out.

minikN · 2020-03-05T08:45:44Z

@minikN You'll notice that red is used for the vc-deleted face, not for any of the syntax highlighting. I think that red is a good indicator of deleted lines in version control and green is good for additions in version control. Also, I agree with @ema2159 It can be hard to get a consistent look across different modes. I tried to get a good balance of matching Monokai and getting a good contrast between colors in the different modes that I tried out.

Alright. That clarified it. Would you be able to give an example where Monokai Pro varies between different modes? At least for JS and PHP I haven't noticed that.

Regardless, I would still recommend sticking to the original as close as possible. Monokai Pro uses #ff618819, #ff618826 and #a9dc7619, #a9dc7626 (Just darkened variants of #ff6188 and #a9dc76) for version control (at least the VSCode implementation):

So both your red (#cc6666) and your pink (#ed6c88) color don't match. In fact, your green (#b4d982) doesn't match either. I haven't looked at the other colors. Still wondering where they coming from :(

Reading through the your previous comments, it sound like you used a color picker to pick colors from the screenshots on https://www.monokai.pro ? If so, that might not be accurate.

If I load the theme in VSCode and do CTRL + SHIFT + P -> Developer: Generate Color Theme From Current Settings It will generate a JSON with all the colors used in the theme. These are accurate.

minikN · 2020-03-05T09:10:07Z

Go ahead! We're reviewing this current one so it may take some time

Hi @ema2159 . I've created a first "beta". It's not ready for a PR yet. However, seems to be I am too stupid to even load the theme properly. I've added
(package! doom-monokai-pro-spectrum-theme
  :recipe (:host github :repo "minikN/doom-emacs-monokai-pro-spectrum"))
into my packages.el and (setq doom-theme 'doom-monokai-pro-theme) into my config.el.

This is what I get: condition-case: Error in a Doom startup hook: doom-init-theme-h, (error "Unable to find theme file for ‘doom-monokai-pro-theme’")

@ema2159 Would you be able to help with that?

ema2159 · 2020-03-10T03:13:36Z

@minikN of course, I'll just need sometime. I'm a little busy with my new job but as soon as I can I'll lend you a hand.

hlissner · 2020-03-10T16:59:01Z

@minikN wrt

(package! doom-monokai-pro-spectrum-theme
  :recipe (:host github :repo "minikN/doom-emacs-monokai-pro-spectrum"))

There are two problems with the theme's definition:

Here, you've named the theme monokai-pro-spectrum,
But here, you've announced it as doom-monokai-pro-spectrum

Try removing the provide line entirely (def-doom-theme provides the theme for you), and replace:

-(def-doom-theme monokai-pro-spectrum
+(def-doom-theme doom-monokai-pro-spectrum

hlissner · 2020-03-10T17:07:31Z

@minikN Oh, I forgot to mention a third issue: you need to add the theme's directory to custom-theme-load-path somewhere in the file. e.g.

;;;###autoload
(add-to-list 'custom-theme-load-path (file-name-directory load-file-name))

So Emacs knows where to find it.

minikN · 2020-03-10T17:07:46Z

@minikN wrt
(package! doom-monokai-pro-spectrum-theme
  :recipe (:host github :repo "minikN/doom-emacs-monokai-pro-spectrum"))
There are two problems with the theme's definition:

Here, you've named the theme monokai-pro-spectrum,

But here, you've announced it as doom-monokai-pro-spectrum

Try removing the provide line entirely (def-doom-theme provides the theme for you), and replace:
-(def-doom-theme monokai-pro-spectrum
+(def-doom-theme doom-monokai-pro-spectrum

Thank you @hlissner. I will try this tonight.

Is there any guideline as to how specific a theme should be? I'm talking about mode-specific faces.
Monokai Pro is pretty specific in how it highlights syntax for various modes. As I said some modes, in my case PHP mode didn't even support all the faces needed to implement Monokai Pro properly until I created a PR for it.

I have a local repo for Monokai Pro in which I've added several new faces to PHP mode based on my PR:

;;;; php-mode
   (php-block-delimiter				 :foreground fg-3)
   (php-block-statement				 :foreground red)
   (php-class-declaration-spec 			 :foreground red)
   (php-class-modifiers 			 :foreground red)
   (php-constant-assign 			 :foreground red)
   (php-constant-keyword 			 :foreground purple)
   (php-flow-control-statement			 :foreground red)
   (php-import-declaration 			 :foreground red)
   (php-include-statement 			 :foreground green)
   (php-method-access				 :foreground red :slant italic)
   (php-method-modifiers			 :foreground red :slant italic)
   (php-method-static				 :foreground red :slant italic)
   (php-namespace-declaration			 :foreground red)
   (php-number					 :foreground purple)
   (php-php-tag 				 :foreground orange)
   (php-print-statement				 :foreground green)
   (php-property-access 			 :foreground red :slant italic)
   (php-property-const				 :foreground red :slant italic)
   (php-property-static				 :foreground red :slant italic)
   (php-string-quote				 :foreground fg-3)
   (php-type-operator				 :foreground red)
   (php-function-keyword 			 :foreground blue :slant italic)

   (php-function-name				 :foreground green)
   (php-function-call				 :foreground green)
   (php-string 					 :foreground yellow)
   (php-keyword 				 :foreground blue)
   (php-builtin 				 :foreground purple)
   (php-method-call 				 :foreground green)
   (php-static-method-call 			 :foreground green)
   (php-variable-name 				 :foreground fg)
   (php-property-name 				 :foreground fg)
   (php-variable-sigil 				 :foreground fg-2)
   (php-operator                                 :foreground red)
   (php-paamayim-nekudotayim 			 :foreground red)
   (php-type 					 :foreground blue :slant italic)
   (php-class 					 :foreground red)
   (php-constant 				 :foreground purple)
   (php-constant-assign 			 :foreground blue)
   (php-magical-constant 			 :foreground purple)
   (php-$this 					 :foreground fg-2 :slant italic)
   (php-$this-sigil				 :foreground fg-2 :slant italic)
   (php-errorcontrol-op 			 :foreground red)
   (php-doc-annotation-tag 			 :foreground blue)
   (php-doc-variable-sigil 			 :foreground fg-4)
   (php-doc-$this 				 :foreground fg-4)
   (php-doc-$this-sigil 			 :foreground fg-4)
   (php-doc-class-name 				 :foreground fg-4)

So my question is whether or not there is a threshold as to how fine grained a theme should be.

Thanks.

hlissner · 2020-03-10T17:20:25Z

So my question is whether or not there is a threshold as to how fine grained a theme should be.

It can be as fine grained as you like, so long as you avoid properties that could throw errors, e.g. :font or :family when the specified font is missing on the user's system.

That said, I wasn't aware of php-mode's faces, perhaps they should be added to doom's base theme as well, so all themes can provide rudimentary support for the mode.

minikN · 2020-03-10T22:49:55Z

So my question is whether or not there is a threshold as to how fine grained a theme should be.

It can be as fine grained as you like, so long as you avoid properties that could throw errors, e.g. :font or :family when the specified font is missing on the user's system.

That said, I wasn't aware of php-mode's faces, perhaps they should be added to doom's base theme as well, so all themes can provide rudimentary support for the mode.

Thank you @hlissner . Well as I said, https://github.com/emacs-php/php-mode/pull/594 is merged already, however https://github.com/emacs-php/php-mode/pull/606 is still in review.

Unfortunately, I'm still stuck with loading the theme. I applied the changes you mentioned.

If I now repace (setq doom-theme 'doom-one) with (setq doom-theme 'doom-monokai-pro-spectrum) in config.elI get this: condition-case: Error in a Doom startup hook: doom-init-theme-h (wrong-type-argument stringp nil).

hlissner · 2020-03-10T23:18:41Z

@minikN That likely means load-file-name in (file-name-directory load-file-name) is nil. Change it to

;;;###autoload
(when (and (boundp 'custom-theme-load-path) load-file-name)
  (add-to-list 'custom-theme-load-path
               (file-name-as-directory (file-name-directory load-file-name))))

minikN · 2020-03-11T20:08:20Z

@minikN That likely means load-file-name in (file-name-directory load-file-name) is nil. Change it to
;;;###autoload
(when (and (boundp 'custom-theme-load-path) load-file-name)
  (add-to-list 'custom-theme-load-path
               (file-name-as-directory (file-name-directory load-file-name))))

This worked. Thanks!

ema2159 · 2020-03-13T13:39:10Z

I improved the palette and theming overall. It should look almost the same as VS Code's.

kadenbarlow · 2020-03-13T19:49:42Z

@ema2159 thanks for making those changes. Sorry been super busy at work the past week or so.

ema2159 · 2020-03-13T19:56:49Z

@kadenbarlow don't worry. Thanks for contributing!

hlissner added the is:theme Requests that a theme be added or removed label Feb 28, 2020

kadenbarlow changed the title ~~Add New Themes Based on Monokai, Xcode and Atom One Dark~~ Add New Monokai Dark Theme Feb 28, 2020

ema2159 added New theme and removed is:theme Requests that a theme be added or removed labels Feb 28, 2020

ema2159 mentioned this pull request Feb 28, 2020

Add monokai theme #184

Closed

kadenbarlow changed the title ~~Add New Monokai Dark Theme~~ Add New Monokai Pro Theme Feb 29, 2020

adds doom-monokai-pro

dd775b2

hlissner added is:feature Adds or requests new features, or extends existing ones is:theme Requests that a theme be added or removed and removed New theme labels Mar 4, 2020

minikN reviewed Mar 4, 2020

View reviewed changes

Fix: Monokai Pro's palette

438973c

ema2159 added 2 commits March 13, 2020 14:32

Merge branch 'master' into new-themes

328b58f

Mod: Revert README to remove conflicts. Fix later

39e2d61

ema2159 merged commit 87190c8 into doomemacs:master Mar 13, 2020

github-actions bot locked as resolved and limited conversation to collaborators Jul 14, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add New Monokai Pro Theme #413

Add New Monokai Pro Theme #413

kadenbarlow commented Feb 28, 2020 •

edited

Loading

hlissner commented Feb 28, 2020

ema2159 commented Feb 28, 2020 •

edited

Loading

kadenbarlow commented Feb 28, 2020

ema2159 commented Feb 29, 2020

kadenbarlow commented Feb 29, 2020

ema2159 commented Mar 2, 2020

kadenbarlow commented Mar 2, 2020 •

edited

Loading

minikN commented Mar 4, 2020

ema2159 commented Mar 4, 2020

minikN commented Mar 4, 2020

minikN Mar 4, 2020 •

edited

Loading

ema2159 Mar 10, 2020

minikN Mar 4, 2020

ema2159 Mar 5, 2020

minikN Mar 5, 2020 •

edited

Loading

kadenbarlow commented Mar 5, 2020

minikN commented Mar 5, 2020 •

edited

Loading

minikN commented Mar 5, 2020

ema2159 commented Mar 10, 2020

hlissner commented Mar 10, 2020

hlissner commented Mar 10, 2020 •

edited

Loading

minikN commented Mar 10, 2020 •

edited

Loading

hlissner commented Mar 10, 2020

minikN commented Mar 10, 2020

hlissner commented Mar 10, 2020

minikN commented Mar 11, 2020

ema2159 commented Mar 13, 2020

kadenbarlow commented Mar 13, 2020

ema2159 commented Mar 13, 2020

Add New Monokai Pro Theme #413

Add New Monokai Pro Theme #413

Conversation

kadenbarlow commented Feb 28, 2020 • edited Loading

doom-monokai-pro

hlissner commented Feb 28, 2020

ema2159 commented Feb 28, 2020 • edited Loading

kadenbarlow commented Feb 28, 2020

ema2159 commented Feb 29, 2020

kadenbarlow commented Feb 29, 2020

ema2159 commented Mar 2, 2020

kadenbarlow commented Mar 2, 2020 • edited Loading

minikN commented Mar 4, 2020

ema2159 commented Mar 4, 2020

minikN commented Mar 4, 2020

minikN Mar 4, 2020 • edited Loading

Choose a reason for hiding this comment

ema2159 Mar 10, 2020

Choose a reason for hiding this comment

minikN Mar 4, 2020

Choose a reason for hiding this comment

ema2159 Mar 5, 2020

Choose a reason for hiding this comment

minikN Mar 5, 2020 • edited Loading

Choose a reason for hiding this comment

kadenbarlow commented Mar 5, 2020

minikN commented Mar 5, 2020 • edited Loading

minikN commented Mar 5, 2020

ema2159 commented Mar 10, 2020

hlissner commented Mar 10, 2020

hlissner commented Mar 10, 2020 • edited Loading

minikN commented Mar 10, 2020 • edited Loading

hlissner commented Mar 10, 2020

minikN commented Mar 10, 2020

hlissner commented Mar 10, 2020

minikN commented Mar 11, 2020

ema2159 commented Mar 13, 2020

kadenbarlow commented Mar 13, 2020

ema2159 commented Mar 13, 2020

kadenbarlow commented Feb 28, 2020 •

edited

Loading

ema2159 commented Feb 28, 2020 •

edited

Loading

kadenbarlow commented Mar 2, 2020 •

edited

Loading

minikN Mar 4, 2020 •

edited

Loading

minikN Mar 5, 2020 •

edited

Loading

minikN commented Mar 5, 2020 •

edited

Loading

hlissner commented Mar 10, 2020 •

edited

Loading

minikN commented Mar 10, 2020 •

edited

Loading