🛠️ToolsShed

CSS変数ジェネレーター

ビジュアルエディターでCSSカスタムプロパティ（変数）を作成します。カラーピッカーとプリセットで:rootブロックを生成します。

1個の変数

よくある質問

コード実装

# Generate CSS :root block from a dictionary of variables
def generate_css_variables(variables: dict) -> str:
    lines = [":root {"]
    for name, value in variables.items():
        var_name = name if name.startswith("--") else f"--{name}"
        lines.append(f"  {var_name}: {value};")
    lines.append("}")
    return "\n".join(lines)

# Example: dark mode theme
dark_theme = {
    "--bg-primary": "#0f0f0f",
    "--bg-secondary": "#1a1a1a",
    "--text-primary": "#ffffff",
    "--text-secondary": "#a0a0a0",
    "--accent": "#6366f1",
    "--border-radius": "8px",
    "--font-size-base": "16px",
}

print(generate_css_variables(dark_theme))

Comments & Feedback

Comments are powered by Giscus. Sign in with GitHub to leave a comment.