Create Variations of CSS Themes with Cursor's Composer

John Lindquist
InstructorJohn Lindquist
Share this video with your friends

Social Share Links

Send Tweet
Published 3 months ago
Updated a month ago

Cursor's Composer feature lets us input multiple files as context for us to run commands on. In this lesson we'll give Cursor a handful of theme files that we've created to have it create more popular themes for us. You'll see that it generates popular themes such as monokai and solarized-light

[00:00] Open composer with command I. We'll type hash to add some files, and I'm just gonna add in all of these CSS files here. You can see them referenced over on the left. And so once all of those are added, you'll see that they're in context for any prompt you add here. And I'll just dictate based on these files, create 4 more files following the same naming scheme and [00:20] the same CSS variables and base them on popular themes used in IDE's such as Versus Code. So I'll paste my dictation in and once I hit enter here, it's gonna start working on the task I gave it. And you'll see it created monochi, solarized light, 1 dark pro, GitHub light, and these [00:39] files will pop up in here, and you can accept each of these individually. You'll see all of these buttons as I switch through, or in the main Composer tab, you can accept all of them, which I'll just go ahead and do. And this is an in progress feature in ScriptKit for a theme selector based on CSS. And just to see if these are working, I'll kind of go through, see what [00:59] they gave me. So you can see Solarized, One Dark Pro, Monokai, GitHub Lite. And I'll just keep on repeating this process to generate more and more themes.

Nicolas Mendonca
Nicolas Mendonca
~ 3 months ago

How did you dictate with a voice command? is that a feature from cursor or an external tool? ๐Ÿ‘€

Nicolas Mendonca
Nicolas Mendonca
~ 3 months ago

Also. My composer window is floating around. How did you pin it in the terminal panel?

Akash Manohar
Akash Manohar
~ 3 months ago

Hey Nicolas, EggHead fan here. I was just watching this playlist and I found some of you have the same questions that I did ๐Ÿ˜€

I dug around a bit and found this info from John's tweets - https://x.com/johnlindquist/status/1826028401075122409

  • John is using superwhisper app - https://superwhisper.com/ I just noticed it's available on setapp and downloaded it.

  • John says he dragged the composer to pin it. I don't see how to do that (I tried). But instead of cmd+i if you press shift+cmd+i, then you get a full composer window in an overlay.

Source - this thread

Daniel Garcia
Daniel Garcia
~ 5 days ago

Thanks Akash

Markdown supported.
Become a member to join the discussionEnroll Today