Lahat ng screen test tools

    Gumawa ng Larawang Gradient

    Gumawa ng tuwid o pabilog na gradient na may dalawa o tatlong kulay. Itakda ang anggulo at laki, mag-download ng gradient na background o kopyahin ang CSS para sa website.

    • Tuwid at pabilog na gradient
    • Pag-download ng larawan at CSS

    Gumamit ng buumbilang mula 1 hanggang 8192 bawat gilid, hanggang 16,777,216 pixel sa kabuuan. Ginagawa ang mga larawan sa iyong browser.

    HEX · #RRGGBB
    HEX · #RRGGBB

    Live na preview

    1920 × 1080 px
    Gumawa ng Larawang Gradient

    Pinaliliit ang preview para magkasya. Eksakto sa mga sukat sa pixel sa itaas ang ida-download na larawan.

    background: linear-gradient(90deg, #2563eb, #e879f9);

    Maaaring bahagyang magkaiba ang CSS at PNG dahil magkakaiba ang paraan ng browser sa paghahalo ng mga kulay.

    Pagsusuri ng Gradient

    Paano gamitin

    1. Itakda ang sukat ng larawan at pumili ng tuwid o pabilog na gradient.
    2. Piliin ang panimulang at huling kulay, magdagdag ng gitnang kulay kung kailangan at ayusin ang anggulo ng tuwid na gradient.
    3. I-download ang PNG o JPEG, o kopyahin ang CSS declaration ng background.

    Mga kondisyon at limitasyon

    Gumagawa ito ng pandekorasyong gradient na background. Para siyasatin ang banding, gamitin ang hiwalay na gradient test. Hindi mapapatunayan ng ginawang larawan ang bit depth o katumpakan ng kulay ng display.

    Mga karaniwang tanong

    Ano ang ibig sabihin ng anggulo ng gradient?

    Sinusunod ng mga anggulo ang tuntunin ng CSS: 0° ay mula ibaba pataas, 90° ay mula kaliwa pakanan at 180° ay mula itaas pababa. Nagsisimula sa gitna ang pabilog na gradient.

    Eksakto bang tutugma ang na-download na gradient sa CSS?

    Pareho ang kulay at direksiyon, ngunit maaaring magkaroon ng maliliit na pagkakaiba dahil sa paghahalo ng kulay ng browser at pag-scale ng larawan. Gamitin ang na-download na larawan kapag kailangan ng tiyak na resulta sa pixel.

    Tuklasin pa