# Where can I find the CSS content area? **URL:** \ **Category:** Elements\ **Created:** [May 6, 2025, 1:12pm UTC](https://forums.realmacsoftware.com/t/where-can-i-find-the-css-content-area/47418 "2025-05-06T13:12:35Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![Massimo](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/massimo/32/25456_2.png) [@Massimo](https://forums.realmacsoftware.com/u/Massimo)\ **Post date:** [May 6, 2025, 1:12pm UTC](https://forums.realmacsoftware.com/t/where-can-i-find-the-css-content-area/47418/1 "2025-05-06T13:12:35Z")
Where can I find in [Elements](https://elementsapp.io/) the CSS tab as in RW (see screenshot). It wouldn’t hurt in Theme Studio to have a CSS tab where you can enter custom styles. ![Screenshot 2025-05-06 alle 15.07.48](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/e/9/e9c4529eb43f79ca10e8fed0328154a0e57b9db2.png) ---
**Author:** ![ben](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/ben/32/28488_2.png) [@ben](https://forums.realmacsoftware.com/u/ben)\ **Post date:** [May 6, 2025, 2:48pm UTC](https://forums.realmacsoftware.com/t/where-can-i-find-the-css-content-area/47418/2 "2025-05-06T14:48:59Z")
> [@Massimo](#): > > Where can I find in [Elements](https://elementsapp.io/) the CSS tab You can add custom CSS the entire project via the `Project setting → Template` area. Click the cog icon in the toolbar, found next to the publish button in the top right. That said, questions about custom CSS like this always grab my curiosity—mainly around _why_ custom styles are needed or wanted. Since [Elements](https://elementsapp.io/) is built around a unified design system using **Tailwind** , all components are styled consistently by default. When you introduce one-off custom CSS, you’re essentially stepping outside that system, which can lead to inconsistencies across components or projects—something we generally want to avoid. That being said, there are definitely valid cases where stepping outside the system makes sense—like when integrating a third-party library that requires specific CSS. I’d love to hear more about _why_ you’re using custom CSS and see if we can help translate that into Tailwind and keep it within the [Elements design system](https://docs.realmacsoftware.com/elements-docs/elements-app/design-system) 🙂 ---
**Author:** ![Massimo](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/massimo/32/25456_2.png) [@Massimo](https://forums.realmacsoftware.com/u/Massimo)\ **Post date:** [May 6, 2025, 3:02pm UTC](https://forums.realmacsoftware.com/t/where-can-i-find-the-css-content-area/47418/3 "2025-05-06T15:02:33Z")
For the time being, mine was only a theoretical request in case of need; I don’t really need it now. Just to know, also any JS code should always be placed in `Project setting → Template`? Anyway, if I have a Container, with some components inside, and I would like to animate only a specific component when the mouse is hover the Container. How can I achieve that? ---
**Author:** ![ben](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/ben/32/28488_2.png) [@ben](https://forums.realmacsoftware.com/u/ben)\ **Post date:** [May 6, 2025, 6:12pm UTC](https://forums.realmacsoftware.com/t/where-can-i-find-the-css-content-area/47418/4 "2025-05-06T18:12:37Z")
> [@Massimo](#): > > Just to know, also any JS code should always be placed in `Project setting → Template`? If it’s something that is Project specific, yes. Otherwise each component should manage any JavaScript it requires internally within itself. > [@Massimo](#): > > I have a Container, with some components inside, and I would like to animate only a specific component when the mouse is hover the Container. How can I achieve that? You can do this by utilising the Transforms controls, which are included on all built-in core components. I’d suggest checking out the [Transforms documentation](https://docs.realmacsoftware.com/elements-docs/elements-app/components/common-controls/transforms) — there is a demo video showing you how to achieve exactly what you’re describing! Hope that help, and let us know if you have any questions along the way 🙂 ---
**Author:** ![Massimo](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/massimo/32/25456_2.png) [@Massimo](https://forums.realmacsoftware.com/u/Massimo)\ **Post date:** [May 6, 2025, 7:21pm UTC](https://forums.realmacsoftware.com/t/where-can-i-find-the-css-content-area/47418/5 "2025-05-06T19:21:24Z")
On the **Transform** properties of the **Container** component I can’t select a specific element by ID or class. ![Screenshot 2025-05-06 alle 21.18.55](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/1/9/1980e8679eaa0e85d02a7d6feddf20ce395dd6fa.png) ---
**Author:** ![ben](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/ben/32/28488_2.png) [@ben](https://forums.realmacsoftware.com/u/ben)\ **Post date:** [May 7, 2025, 7:29am UTC](https://forums.realmacsoftware.com/t/where-can-i-find-the-css-content-area/47418/6 "2025-05-07T07:29:57Z")
You’ll want to check out the dropdown just below. ![CleanShot 2025-05-07 at 09.28.12@2x](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/e/a/ea1ca2ecf661e27737fa6ed1464b769a6bd0380a.png) The `To` dropdown in the Container allows you to apply transforms different layers of the Container — everything, only the background, or only the content. Hope that helps 🙂 ---
**Author:** ![Massimo](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/massimo/32/25456_2.png) [@Massimo](https://forums.realmacsoftware.com/u/Massimo)\ **Post date:** [May 7, 2025, 7:58am UTC](https://forums.realmacsoftware.com/t/where-can-i-find-the-css-content-area/47418/7 "2025-05-07T07:58:51Z")
What I would like I think cannot be achieved with a single Container (if these are the settings). In the screenshot you see the structure of my Container. ![Screenshot 2025-05-07 alle 09.55.33](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/4/a/4a3e6c5007aa7e3c5fa680bc648c1df75069b107.png) I would like that when hovering the mouse over the Container: - the Container would move up by 10px - the SVG icon would animate with a rotation. The way the Transform section is set up, you can only assign one animation at a time. I would be forced to add a new Container as a wrapper. Going back to my request for the CSS area – here in this case it would be easier and faster for me to insert the CSS code. ---
**Author:** ![Massimo](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/massimo/32/25456_2.png) [@Massimo](https://forums.realmacsoftware.com/u/Massimo)\ **Post date:** [May 7, 2025, 8:06am UTC](https://forums.realmacsoftware.com/t/where-can-i-find-the-css-content-area/47418/8 "2025-05-07T08:06:48Z")
Ah ok… now I get it, I have to act on the component to animate and then point to the parent (and not the other way around). 👍 ---
**Author:** ![ben](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/ben/32/28488_2.png) [@ben](https://forums.realmacsoftware.com/u/ben)\ **Post date:** [May 7, 2025, 8:14am UTC](https://forums.realmacsoftware.com/t/where-can-i-find-the-css-content-area/47418/9 "2025-05-07T08:14:12Z")
> [@Massimo](#): > > I have to act on the component to animate and then point to the parent (and not the other way around). Exactly! Glad you figured it out 😃