how to format text colors in the form of programming language code?

Question

I want to create layout for code editor in Adobe XD (something like this: https://mir-s3-cdn-cf.behance.net/project_modules/1400/2e966c66760499.5b212e4d0b583.png ) and I don't know how to format code which is TEXT in the style of some programming language (for example python).
I can change font to Courier New (which is nice), but I have no idea how to change colors of the code - to see functions, loops and so on.

I have no idea how to deal with this problem. Should I use any plugin or somehow format the text?
Can somebody help with this issue?

stuart__k · Accepted Answer

We don't have this feature, but it would make a great plugin!

There are a few JS syntax highlighting libraries, but they would need to be changed to generate XD text runs, rather than html spans:

* microlight/microlight.js at master · asvd/microlight · GitHub

* GitHub - highlightjs/highlight.js: Javascript syntax highlighter

* GitHub - ccampbell/rainbow: Simple syntax highlighting library written in javascript

CoreyRLucier · Answer

Just draw out an area text with the text tool..., don't use point text (e.g. draw a rectangle with the text tool)..set to the font of your choice then highlight the text via selection and changing the fill color in the property inspector.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded