Yesterday, we looked at the problems with CSS frameworks, and I suggested going completely without one. To do that, let me make an initially awful suggestion—and then make it much more appealing.

The Concept

Here’s my (conceptual) suggestion: use something like ViewComponents and write all your styles inline.

Hear me out. If you have a button component with inline styles, that’s essentially the same as having a button component and a separate button.css file that you import—this approach simply keeps everything in one place.

The benefits include:

• Isolation from all other components. If I update the button’s style, it won’t unintentionally affect the modal’s appearance. This helps avoid spooky actions in your frontend styles.
• You can still pull in third-party components with their styles inline. This keeps your codebase isolated, though it can make maintenance more challenging.
• The structure and style of your components will be highly cohesive. By combining them directly, you can more easily reason about what they do as a single, unified unit.

It’s not all sunshine and roses, though. You might encounter issues with shared colours and sizing, which can make consistency harder to maintain. Additionally, some inline CSS isn’t possible—or can be awkward to implement.

The Fix

Okay, I lied—I actually recommend using Tailwind CSS.

But in my defence, Tailwind is a very thin framework around raw CSS. It doesn’t impose specific styles. The most prescriptive default it offers is its color scheme, but that’s incredibly easy to customize and is well supported throughout your application.

This combination—ViewComponent + Tailwind CSS—gives you isolated components, consistent design across your app, compatibility with third-party components, and a better developer experience by unifying structure and style in a single place.

⸻

How are you handling frontend components? Are you using a framework like Bootstrap, or building your own?