CSS Variable Generator
Description
This AI app can transform your SCSS code into a list of hard-coded variables in CSS. Simply input your SCSS code and the app will generate a list of variables that you can use in your CSS file. Just copy and paste the generated variables into your CSS and enjoy the benefits of hard-coded variables.
Workflow
Input
scss code-Scss code
1. CSS Variable Generator
Model: gpt-4o
Prompt:
transform this into a list of hard coded variables in css: --light: #FFE2CE;
$light-palette: (
100: #FFE2CE,
90: opacify(#FFE2CE, 0.9),
80: opacify(#FFE2CE, 0.8),
70: opacify(#FFE2CE, 0.7),
60: opacify(#FFE2CE, 0.6),
50: opacify(#FFE2CE, 0.5),
40: opacify(#FFE2CE, 0.4),
30: opacify(#FFE2CE, 0.3),
20: opacify(#FFE2CE, 0.2),
10: opacify(#FFE2CE, 0.1),
);
Output:
1: CSS Variable GeneratorCSS Variable Generator
Information
Creator: Pedro Vilchez
6
Runs
0
Bookmarks
-
Avg. Time
$0.00
Avg. Cost
Examples (0)