# How to Edit CSS in Joomla

> To edit CSS in Joomla, access the System menu, navigate to Site Templates, and open the Cassiopeia template. Next, open the CSS directory and select editor.css to examine the h1 heading style definition. Finally, click Save and Close to preserve your template customizations.

Canonical: https://livedemo.ai/tutorials/how-to-edit-css-in-joomla/
Apps: Joomla
Updated: 2026-10-05
Interactive demo: https://story-api.livedemo.ai/workspaces/62255d3d3304f17b8f5e2d03/stories/692a3c75ab56e05a00fe3ef7/preview?step=1

## Steps

1. Access the core configuration area through the 'System' menu to manage your site settings.
2. Explore 'Site Templates' where you can customize the visual appearance of your Joomla website.
3. Open 'Cassiopeia', Joomla's modern and responsive default template, to customize its appearance.
4. Access the 'CSS' directory where style files control your template's visual presentation.
5. Open 'editor.css ' which controls the styling of content editing interfaces.
6. Examine the h1 heading style definition to customize your site's typography.
7. Click 'Save & Close' to preserve your template customizations to instantly update your site's appearance.