This tool is a chrome extension to generate CSS variables from the Frontend Mentor instructions.
Input:
- White: hsl(0, 0%, 100%)
- Light pink: hsl(275, 100%, 97%)
- Grayish purple: hsl(292, 16%, 49%)
- Dark purple: hsl(292, 42%, 14%)
Output:
:root {
--White: hsl(0, 0%, 100%);
--Light-pink: hsl(275, 100%, 97%);
--Grayish-purple: hsl(292, 16%, 49%);
--Dark-purple: hsl(292, 42%, 14%);
}