Let’s say you would like to modify the appearance of your website, or some elements of it, like the chatbot added by my AI Engine plugin. This is totally possible, and in 2026 it’s easier than ever, especially with AI chatbots that happen to be very fluent in CSS.

The shortcut: just ask a chatbot

If you don’t want to learn CSS from scratch, ask a chatbot. ChatGPT, Claude, and Gemini are all very good at writing CSS. Describe what you want (“make the chatbot bubble blue and rounded”, “hide the date on my single posts”), paste a screenshot or the relevant HTML if you have it, and they will give you ready-to-use CSS in seconds. Try it, you might be surprised by how well it works 🙂

Even better, pair the chatbot with the DevTools trick below: grab the exact selector from your browser, paste it in your prompt, and the chatbot will write the exact rule you need.

If you want to learn CSS yourself

It’s absolutely worth learning the basics. You will reuse this skill many times. The best starting point is still Mozilla’s tutorial: What is CSS.

Play with CSS in realtime on your site

Once you know a bit of CSS (or just want to find the right selector to feed to a chatbot), you need to inspect the elements you want to change. The easiest way is to use your browser’s Developer Tools. Chrome’s guide is here: View and change CSS with Google Chrome. Firefox and Safari have very similar tools.

You can select any part of your site, tweak the CSS live, and confirm it does what you want before saving it anywhere.

Apply the CSS permanently

There are a few ways to do this depending on your theme. All of them work, pick the one you’re most comfortable with.

Classic (non-FSE) theme

Go to Appearance > Customize > Additional CSS in your WordPress admin. Paste your CSS there and hit Publish. Since it’s attached to the theme, switching themes will remove it, which is usually what you want.

Block theme (FSE)

Block themes hide the old Customizer, but you have two clean options:

  • Site Editor (modern path): open Appearance > Editor, click Styles, then the pencil/edit icon, and you’ll find an Additional CSS field at the bottom.
  • Legacy Customizer: it’s still there, just hidden. Type https://mywebsite.com/wp-admin/customize.php in your browser. Bookmark it, it’s a handy shortcut 🙂

Using a plugin

If you’d rather keep the CSS independent from the theme, a small plugin like Simple Custom CSS does the job. Drop your CSS in, save, done. It will keep working even if you switch theme later on.