サービスを検索

ツールとページをすばやく検索して開けます

ベストグラデーション

区別しつつストップ間で読みやすいコントラストを保つよう厳選。カードを選んで生成で再利用します。

More hubs:ツールガイドブログ

ベストグラデーションを読み込み中…

よくある質問

What makes these "best" gradients?
They are hand-curated to look distinct and to keep stronger contrast between stops so type and UI elements stay readable when you reuse them in the generator.
How do I use a preset?
Click a card to open that gradient in the free CSS gradient generator. From there you can lock stops, copy linear-gradient CSS, and export PNG or JSON locally.
Can I edit a preset after opening it?
Yes. Harmony modes, locks, sliders, and exports work the same as when you build a gradient from scratch; the preset is only a starting point.

主要チームに利用・信頼されています

横スクロールのロゴ(各リンクはブランドサイトを新しいタブで開きます): Google, Apple, Meta, GitHub, Stripe, Shopify, Databricks, Snowflake, Notion, Vercel, Intel, NVIDIA, Netflix, Spotify, Airbnb, Yale, Harvard University, Massachusetts Institute of Technology, Stanford University, University of California, Berkeley, Princeton University, California Institute of Technology, Columbia University, University of Chicago, Cornell University, Duke University, Carnegie Mellon University, Georgia Institute of Technology, Johns Hopkins University, Northwestern University, University of Toronto, McGill University, University of Oxford, University of Cambridge, Imperial College London, University College London, ETH Zurich, EPFL, Technical University of Munich, Sorbonne University, KU Leuven, National University of Singapore, Nanyang Technological University, Tsinghua University, Peking University, The University of Tokyo, KAIST, Seoul National University, University of Melbourne, Australian National University, University of Sydney, The University of Hong Kong.