左下のカラーピッカーで選択した色をベースに右下のスライダーでHSLを変化させてグラデーションを生成しています。
・カラーピッカー横のスライダーを変更するとグラデーションの開始位置、終了位置を調製できます。
・：グラデーションの方向・角度を30度ずつ変更できます。
・：ランダムにグラデーションを生成します。
・： 生成したlinear-gradientを表示します。

テキストは「inline-block」にするなどインライン要素に設定することをオススメします。
ブロック要素だとグラデーションがテキストに上手く反映されないことがあります。