UI/Frontend - Create Custom Form Input Styles with TailwindCSS

Job ID: 35122982

Budget: €12 – €18 EUR

Dear Freelancer,

We are working on a project relating to survey forms. From our platform, users can generate questions and values. After creating the survey, the user can share the survey link for others to fill the form. We are looking for a UI/Frontender to help us create beautiful and innovative input styles, which will make filling forms fun and engaging for students.

We will start by building four input types, in two different versions, with various numbers of values. However, we will begin with a slider – which we will approve, before we move to the next ones (checkboxes, grids, etc.)
Example of a slider: https://flowbite.com/docs/forms/range/
“Slider”, with 4-8 input values (e..g, “Very dissatisfied, Dissatisfied, Satisfied, Very Satisfied”)
Where each input value has a text label and a numeric value.

However, a normal range slider is boring – right? It doesn’t fuel engagement and fun for students to fill the questionnaire. Therefore, you will be building two versions of a range slider; one where you think of kids filling the survey and one for adults filling the survey. You have very free hands, but we are not looking for a boring range slider – please use your creativity. E.g., think of the higher the value, the more a smiley face – or other creative ideas.

Restrictions:
- NO bootstrap, ONLY TailwindCSS
- NO jQuery (only plain es6)
- Limit custom CSS as much as possible

We will start with the slider, and your work and code will then be reviewed by myself and our Head of Development. We will pay for your time spent in case our styles do not match.

To ensure that you have read and understood my proposal, kindly start your text/offer with "The weather is great today!", this way I know you have read this.

Kind Regards,
Rasmus
Related categories: HTML UI / User Interface Tailwind CSS