---
title: "Discussion on \"How to Build a Sign Up Form with Floating Labels and Transitions Using Plain HTML and CSS\" | Hashnode"
description: "Discussion on \"How to Build a Sign Up Form with Floating Labels and Transitions Using Plain HTML and CSS\". In this tutorial we are going to build a modern sign up form with floating labels and smooth transitions using plain HTML and CSS.\n\nA view\nAs you can see in the above image, when an input within the form gains focus, its label floats to the top and a..."
url: "https://hashnode.com/posts/how-to-build-sign-up-form-with-html-and-css/66d4617c57503cc72873dee0"
---

[Feed](https://hashnode.com/feed) /

Discussion

# [How to Build a Sign Up Form with Floating Labels and Transitions Using Plain HTML and CSS](https://freecodecamp.org/news/how-to-build-sign-up-form-with-html-and-css?utm_source=hashnode&utm_medium=feed)

In this tutorial we are going to build a modern sign up form with floating labels and smooth transitions using plain HTML and CSS. A view As you can see in the above image, when an input within the form gains focus, its label floats to the top and a...

Sep 13, 2021 · 7 min read · freecodecamp.org  
Updated Oct 15, 2024  
Read the article

-   [#css](https://hashnode.com/tag/css)
-   [#html](https://hashnode.com/tag/html)
-   [#transitions](https://hashnode.com/tag/transitions)

## Written by

[Kingsley Ubah](https://hashnode.com/@kingchuks)

@kingchuks

  
[View profile](https://hashnode.com/@kingchuks)

Backend developer | Technical Writer | Experienced in developing and deploying web and mobile apps

Technical writer | Backend web developer | Experienced in developing and deploying web and mobile applications. Writes for @Logrocket, @tutsplus and more

## Responses

Markdown supported · ⌘↵ to post

No responses yet.