Mental Model

One Rule

Styles belong in CSS.

Not partly.
Not eventually.
From the beginning.

Everything in Shilp CSS is designed to protect that boundary.

The Traditional Way

Most modern styling tools ask you to decorate markup.

You add classes.
You tweak strings.
You move appearance closer to markup.

Shilp CSS makes a different move.
You compose styles inside CSS, then apply them through named classes.

HTML describes structure and meaning.
CSS describes layout, appearance, and behavior.

This separation is not nostalgia. It is clarity that pays off.

How To Think?

When you style an element, don’t ask:
“What classes should I add?”

Ask this instead:

• What is the layout?
• How does it align or flow?
• How does it look?
• How does it behave?

Each answer lives in a clear and explicit intent.

Layout decisions stays together.
Text decisions stays together.
Animation decisions stays together.
…and the pattern continues across the system.

Intent is grouped. Nothing ends up scattered.

What This Changes

Because intent is grouped in CSS:

• You don’t scatter intent across templates
• You don’t refactor by hunting class strings
• You don’t rely on conventions to imply meaning

Structure is explicit.
Ownership is visible.
Changes have a clear place to go.

This is what makes refactors calm instead of risky.

What You Are Agreeing To

Before going further, be honest with yourself.

Shilp CSS will feel right only if you agree with following:

• I want markup to stay readable
• I’m okay with writing more CSS (code)
• I value refactoring safety over typing speed
• I care where decisions live
• I build things meant to last

If any of these feel like friction, Shilp CSS will feel uncomfortable.

That discomfort is intentional.

What You Gain

In exchange, you get:

• Styles you can reason about years later
• Centralized, owned decisions
• Predictable, static and purgable output
• Smaller bundler size (HTML and CSS combined)
• A system that grows without falling apart

The complexity does not disappear. It becomes organized.

What You Pay

You pay with:

• Slightly slower build time
• Less ecosystem sugar
• More thinking upfront

Shilp CSS trades velocity for composure.

Hold This Mental Model

If you want remember only one thing, remember this:

Shilp CSS prioritizes clarity over time.

It is not a shortcut. It is a way of working.