This is an example of a web form that consists of feedback reactions icons, designed using HTML, CSS, JavaScript, and Bootstrap framework 4. The feedback icons are imported to the code with their URLs. The concept of Lists has been used with UL and LI components. UL element has been used with the child elements of LI to display the icons in an orderly manner. JavaScript functions are used to implement the active status of the feedback icons. The number of feedback icons is five with angry, sad, ok icons and two happy icons. Each icon has three sections as eye left, eye right, and mouth, which is used to implement the reactions. The colors of the feedback icons are predefined as normal: #ECEAF3, normal-shadow: #D9D8E3, normal-mouth: #9795A4, normal-eye: #595861, active: #F8DA69, active-shadow: #F4B555, active-mouth: #F05136, active-eye: #313036, active-tear: #76b5e7, and active-shadow-angry: #e94f1d. The cursor style for the icons is given as pointer to get the hand cursor effect on a hover event. The reaction animations are created by giving different styles to the eyes and mouth sections of each icon.
Source: https://codepen.io/aaroniker/pen/mdyYBPP