Have you ever wanted to have a CSS editor directly in your browser? Now you can with TelescopeCSS! Whether you want to try a new style in your web page or just play with CSS here you will find whatever you need to accomplish your goal.
Table of contents 📕
TelescopeCSS brings a features-full CSS editor with syntax highlighting that can be fully customized.
As said before, TelescopeCSS brings a wide variety of different and useful features for making your development as easy and comfortable as possible.
This is one of those essential features that a code editor cannot miss and so TelescopeCSS. Its editor provides a full autocomplete tool to make your development faster.
Forget about those unuseful autocompletes that doesn't understand the page you are editing! TelescopeCSS provides a autocomplete to all the classes and ids of the page. Just write a . (for classes) or a # (for ids) and you will see how styling becomes a way easier task!
See how your changes are applied instantly as you write. Now you have no excuse to take a look to what you are doing (to the webpage).
Edit whatever color you write directly from the editor with a intuitive UI tool. Now you won't have to enter to one of those ads-full color-picker webpages anymore 😉.
Make TelescopeCSS yours by customizing how every individual syntax token is colored, by choosing between dark 🌙 and light ☀️ themes as well and by saving and importing themes as well!
Choose between dark and light themes by clicking in the select element of the Color Mode section.
Note
I am really sorry for your eyes 😅
To save your themes, just click the Download button on the left corner and it will be automatically downloaded in JSON format.
Tip
TelescopeCSS theme files can be easily shared since they are saved as plain text, feel free to share or publish them to whoever or wherever you want 😉.
To import themes, just click the Import button on the right of the Download one, select your desired theme from your file manager and... Bum! Now the theme is applied to the whole editor!
A TelescopeCSS theme file must follow this syntax and must include all the types of tokens:
{
"<token>": {
"light": color,
"dark": color
}
}I would like to take a moment to thank these awesome Open Source projects that have made TelescopeCSS possible:
