🌅CSS ਗ੍ਰੇਡੀਐਂਟ ਜਨਰੇਟਰ

linear, radial ਅਤੇ conic ਵਿੱਚ ਫ਼ਰਕ

CSS ਦੇ ਗ੍ਰੇਡੀਐਂਟ ਵਿੱਚ ਤਿੰਨ ਫੰਕਸ਼ਨ ਹਨ ਜਿਨ੍ਹਾਂ ਵਿੱਚ ਰੰਗ ਬਦਲਣ ਦਾ ਢੰਗ ਵੱਖਰਾ ਹੈ, ਅਤੇ ਇਹ ਸਾਰੇ background ਪ੍ਰਾਪਰਟੀ ਵਿੱਚ ਲਿਖ ਕੇ ਵਰਤੇ ਜਾਂਦੇ ਹਨ।

• linear-gradient：linear-gradient ਉਹ ਲੀਨੀਅਰ ਗ੍ਰੇਡੀਐਂਟ ਹੈ ਜਿਸ ਵਿੱਚ ਰੰਗ ਤੈਅ ਕੀਤੇ ਕੋਣ ਵਾਲੀ ਸਿੱਧੀ ਲਾਈਨ ਦੇ ਨਾਲ-ਨਾਲ ਬਦਲਦਾ ਹੈ।
• radial-gradient：radial-gradient ਉਹ ਗੋਲ ਗ੍ਰੇਡੀਐਂਟ ਹੈ ਜਿਸ ਵਿੱਚ ਰੰਗ ਕੇਂਦਰ ਤੋਂ ਬਾਹਰ ਵੱਲ ਗੋਲ ਜਾਂ ਅੰਡਾਕਾਰ ਸ਼ਕਲ ਵਿੱਚ ਫੈਲਦਾ ਹੈ।
• conic-gradient：conic-gradient ਉਹ ਕੋਨਿਕ ਗ੍ਰੇਡੀਐਂਟ ਹੈ ਜਿਸ ਵਿੱਚ ਰੰਗ ਕੇਂਦਰ ਦੇ ਦੁਆਲੇ ਘੜੀ ਦੀ ਦਿਸ਼ਾ ਵਿੱਚ ਇੱਕ ਚੱਕਰ ਲਾਉਂਦੇ ਹੋਏ ਬਦਲਦਾ ਹੈ।

ਕੋਣ ਅਤੇ ਦਿਸ਼ਾ ਕੀਵਰਡ ਦਾ ਮੇਲ

linear-gradient ਦਾ ਕੋਣ 0deg ਹੋਣ 'ਤੇ ਦਿਸ਼ਾ ਹੇਠਾਂ ਤੋਂ ਉੱਪਰ ਵੱਲ ਹੁੰਦੀ ਹੈ, ਅਤੇ ਅੰਕ ਵਧਣ ਨਾਲ ਇਹ ਘੜੀ ਦੀ ਦਿਸ਼ਾ ਵਿੱਚ ਘੁੰਮਦੀ ਹੈ। ਕੋਣ ਨੂੰ “to right” ਵਰਗੇ ਦਿਸ਼ਾ ਕੀਵਰਡ ਨਾਲ ਵੀ ਲਿਖਿਆ ਜਾ ਸਕਦਾ ਹੈ; 90deg ਦੀ ਦਿਸ਼ਾ “to right” ਅਤੇ 180deg ਦੀ ਦਿਸ਼ਾ “to bottom” ਵਾਲੀ ਹੀ ਹੁੰਦੀ ਹੈ।

ਕਲਰ ਸਟਾਪ ਅਤੇ ਪਾਰਦਰਸ਼ਤਾ ਲਿਖਣ ਦਾ ਢੰਗ

ਕਲਰ ਸਟਾਪ ਉਹ ਸਥਿਤੀ ਹੁੰਦੀ ਹੈ ਜਿੱਥੇ ਗ੍ਰੇਡੀਐਂਟ ਵਿੱਚ ਉਹ ਰੰਗ ਆਉਂਦਾ ਹੈ; 0% ਸ਼ੁਰੂਆਤੀ ਬਿੰਦੂ ਅਤੇ 100% ਅੰਤਿਮ ਬਿੰਦੂ ਦਰਸਾਉਂਦਾ ਹੈ। ਉਦਾਹਰਨ ਵਜੋਂ “#3B82F6 0%, #8B5CF6 100%” ਦਾ ਮਤਲਬ ਹੈ ਕਿ ਰੰਗ ਸ਼ੁਰੂਆਤ ਦੇ ਨੀਲੇ ਤੋਂ ਅੰਤ ਦੇ ਜਾਮਨੀ ਵੱਲ ਬਦਲਦਾ ਹੈ।

• #RRGGBB ਫਾਰਮੈਟ：#RRGGBB ਫਾਰਮੈਟ ਰੰਗ ਲਿਖਣ ਦਾ ਉਹ ਢੰਗ ਹੈ ਜਿਸ ਵਿੱਚ ਲਾਲ, ਹਰੇ ਅਤੇ ਨੀਲੇ ਦੀ ਤੀਬਰਤਾ ਦੋ-ਦੋ ਅੰਕਾਂ ਦੇ ਹੈਕਸਾਡੈਸੀਮਲ ਵਿੱਚ ਦਿੱਤੀ ਜਾਂਦੀ ਹੈ; #FF0000 ਅਪਾਰਦਰਸ਼ੀ ਲਾਲ ਦਰਸਾਉਂਦਾ ਹੈ।
• rgba ਫਾਰਮੈਟ：rgba ਫਾਰਮੈਟ ਰੰਗ ਲਿਖਣ ਦਾ ਉਹ ਢੰਗ ਹੈ ਜਿਸ ਵਿੱਚ ਲਾਲ, ਹਰੇ ਅਤੇ ਨੀਲੇ ਦੇ ਮੁੱਲ (0–255) ਨਾਲ ਪਾਰਦਰਸ਼ਤਾ (0–1) ਵੀ ਜੋੜੀ ਜਾਂਦੀ ਹੈ; ਪਾਰਦਰਸ਼ਤਾ 0.5 ਅੱਧਾ ਪਾਰਦਰਸ਼ੀ ਰੰਗ ਦਰਸਾਉਂਦੀ ਹੈ।