Jump to Colors and Fonts in PhpStorm

Recently a customer asked us where the colors and fonts come from in PhpStorm, and how they can be adjusted. We’re sharing the answer and hoping it will be helpful for everyone.

In PhpStorm, you can set the font and color schemes to achieve your preferred layout for colors and fonts. These affect syntax and error highlighting in the editor, search results, the debugger, and consoles. PhpStorm is very flexible: you can use one of many pre-defined color schemes, customize them to your taste, or create your own.

However, it may not be apparent where the color of this or that element comes from. This is why we came up with the Jump to Colors and Fonts action. To use this, place the caret on any element in your code, press Double Shift (Search Everywhere), and find the Jump to Colors & Fonts item.

JumpColors

A popup window will show you the styles that affect the specific element under the caret. You can then easily navigate to each of the related settings and adjust colors based on your needs and preferences.

jump2

We hope this feature is helpful for you. Please do give us your feedback!

Your PhpStorm Team
The Drive to Develop

 

This entry was posted in Cool Feature, Newsletter. Bookmark the permalink.
  • PsychodelEKS

    OMG. That is awesome. Wish there was smth alike for any element under cursor (like breadcrumbs, gutter etc).

  • Борис Беньковский

    That is awesome. Unfortunately its doesn’t work for whitespaces :(

    • Vladimir Luchansky

      It’s Settings/Preferences | Editor | Color Scheme | General > Text > Whitespaces if you need to change the color of the visible whitespace dot.
      But is it really necessary to jump to this option?

  • Robert

    Nice feature. Good job!

  • Doqnach

    PHPStorm 2017.2.1 (Mac): in a *.php file, my caret is on a classname of an HTML element (). It then says the colour consists of: PHP > PHP CODE > background, PHP > PHPDOC > markup, PHP > PHPDOC > Text. This seems not right?

  • Fendi Setiawan

    Best font I’ve used : Fira Code.
    It’s awesome for logical symbol.