We use floating labels on our own contact form. We like how they look. But we want to be honest about the tradeoffs we accepted when we made that choice, because they're real.
What floating labels actually do
The pattern: a label sits inside the input at full size, acting as a placeholder. When the user focuses the field (or types in it), the label animates up and shrinks, becoming a persistent label above the input while the user types.
The appeal is obvious. It's compact - you get the affordance of a label without the vertical space cost of a separate label element above the field. And the animation, done well, feels polished.
The costs
Cognitive load on first glance. Before focus, a floating label looks identical to placeholder text. Users who have learned that placeholder text disappears when they type may not distinguish between the two. They may start typing without reading the label, assuming it'll vanish.
The small text problem. When floated, the label needs to be noticeably smaller than the input text to not compete with it visually. This usually means the label ends up around 10–11px, which is below comfortable reading size for many users - and well below WCAG's recommendations for text that needs to be legible.
Contrast at rest. If the label at rest looks like placeholder text (low contrast, styled similarly), users with low vision may not see it at all. Placeholder-style text is typically at 40-50% opacity for aesthetic reasons that don't serve everyone.
The pattern optimises for aesthetics and compactness at the cost of immediate clarity. Whether that tradeoff is worth it depends on your users and context.
When we use them anyway
For our own studio site, the form is a single-purpose contact form with short, familiar fields (name, email, subject, message). The cognitive cost is low because the fields are unsurprising. A first-time user encountering a floating label form for an unfamiliar complex task would be a different situation.
If you use floating labels: test with real users, make sure the floated label meets contrast requirements at its smaller size, and consider whether the space saving is actually worth it for your specific form.