There is a pattern in design reviews that repeats itself constantly: a screen feels off, someone says it needs more contrast or a stronger accent colour, the palette gets adjusted, and the screen still feels off. The colours were never the problem. The type was.
Why designers reach for colour first
Colour is immediate and easy to manipulate. Changing a hex value takes three seconds. Reworking a type scale takes an afternoon and requires decisions that are harder to explain in a review — why this size ratio, why this weight for that element, why this line-height for body copy and not that one. Colour is fast. Type is slow. So colour gets touched first, and the underlying hierarchy problem stays unresolved.
The other reason is that type problems are harder to name. A broken colour contrast has accessibility scores to point at. A broken type hierarchy just feels vague — something is unclear, the eye doesn't know where to go, the content doesn't scan. These are accurate descriptions of a problem, but they don't automatically point at type as the source.
Most designers can describe a bad colour combination. Fewer can describe why a 15px regular and a 15px medium sitting next to each other in the same grey fail to communicate a hierarchy relationship even though one is technically bolder.
What broken type hierarchy actually looks like
The most common form is weight without contrast. A designer assigns font-weight 500 to a label and font-weight 400 to body text, expects the eye to read one as prominent and the other as secondary, and wonders why the screen feels flat. At small sizes and low contrast environments, a 100-weight difference is invisible. The hierarchy exists in the file and nowhere else.
The second most common form is size compression. Everything lives between 13px and 16px because anything smaller feels inaccessible and anything larger feels aggressive. The result is a band of type that all competes at roughly the same optical size, leaving the layout with no dominant element and no clear reading path.
The third is the opposite problem — size without weight. A headline is large but light, body copy is small but regular weight, and the eye reads the body copy as more important because weight communicates permanence before size does. This is why a 14px bold number in a dashboard card reads as more significant than a 32px light heading above it.
These three problems — invisible weight delta, compressed size range, and mismatched size-weight combinations — account for most of what gets misdiagnosed as a colour issue.
How to fix it without touching the palette
Start with a simple audit: view the screen in greyscale. Remove every chromatic signal and read what remains. If the hierarchy collapses, it was being held together by colour alone. That is the failure to fix.
Then check the weight delta between your most prominent and least prominent text elements. On most rendering engines, a visible hierarchy requires at least a 200-weight gap at body sizes, and 300 at caption sizes. A 400-to-500 step will not hold.
Then check your size range. A healthy editorial type scale typically spans at least a 2.5x ratio from the smallest supporting text to the largest heading. If your range is compressed, extend it — push the headline up, push the metadata down, and hold the body text as the reference point everything else scales from.
Finally, check the combination of size and weight for every element. Prominent elements should be either large, heavy, or both. Supporting elements should be small, light, or both. Any element that is simultaneously small and heavy, or large and light, is sending conflicting signals and will confuse the reading path.
Fix these before adjusting a single colour value. In most cases, the screen will resolve itself.
Colour is a useful tool. It is not a substitute for structure, and no palette is strong enough to compensate for a hierarchy that was never established in the first place.
