CSS Box kivuli Generator (Multi-Layer & Inset)

Kubuni laini, multi-safu CSS sanduku vivuli na kuishi blur, kuenea, inset toggle, na moja click Tailwind / CSS code nje.

Hufanya kazi kwenye kivinjari chako. Faili zako hazitoki kamwe kwenye kifaa. Tazama jinsi ya kuthibitisha

…

Jinsi ya kufanya

  1. 1
    Hatua ya 1: fungua CSS Box kivuli Generator (Multi-Layer & Inset) na uweke taarifa zako

    Andika namba au maandishi yako, ongeza faili, au chagua chaguo unazohitaji. Hakuna kinachopakiwa: kila kitu kinabaki kwenye kivinjari chako.

  2. 2
    Hatua ya 2: CSS Box kivuli Generator (Multi-Layer & Inset) hufanya nini

    Kubuni laini, multi-safu CSS sanduku vivuli na kuishi blur, kuenea, inset toggle, na moja click Tailwind / CSS code nje.

  3. 3
    Hatua ya 3: soma matokeo na ulinganishe

    Matokeo huonekana mara moja. Badilisha thamani moja uone jinsi jibu linavyobadilika, kisha ubaki na namba inayofaa kesi yako.

  4. 4
    Hatua ya 4: nakili au hifadhi

    Nakili matokeo au yapakue. Kwa uamuzi muhimu, yathibitishe kwa chanzo rasmi au mshauri.

Kuhusu zana hii

Kuongeza kina na elevation tactile kwa kadi na vipengele UI. Customize usawa / wima offsets, blur radius, kuenea umbali, na rangi ya kivuli na opacity slider. Mtihani dhidi background mwanga na giza, toggle inset vivuli kwa vyombo vya kubonyeza hali, na nakala kiwango CSS au Tailwind madarasa instantly.

Vidokezo vya matokeo bora

Kabla ya kuanza, tumia muda kidogo kusoma chaguo na ujaribu zana kwa mfano mdogo kwanza. Kila kitu hufanya kazi kwenye kivinjari kwenye kifaa chako mwenyewe; hakuna unachoandika au kuongeza kinachopakiwa na kufunga kichupo hufuta kila kitu. Ikiwa kitu hakionekani sawa, pakia upya ukurasa na ujaribu tena au tumia kiungo cha kuripoti kwenye ukurasa huu kutuambia kilichoharibika. Ikiwa matokeo bado yanaonekana vibaya, badilisha thamani moja kwa wakati ili uone kisanduku gani kinaathiri zaidi. Weka alama ya ukurasa huu ikiwa utaitumia tena.

Kwa ufupi

Maswali yanayoulizwa mara kwa mara

Ninawezaje kuunda kivuli laini, cha kisasa?

Tumia kipenyo kikubwa cha blur (20px-40px), kuenea hasi (-4px), na opacity ya chini (10%-25%) kwenye rangi nyeusi ya slate kwa kivuli laini sana.

Je, msaada huo huweka vivuli vya ndani?

Ndiyo. kuwezesha 'Inset Shadow' toggle kuzalisha madhara ya ndani kivuli bora kwa ajili ya uwanja wa kuingia, visima, na vyombo vya habari zilizowashwa hali.

Je, naweza kupima jinsi kivuli kinavyoonekana kwenye kadi za hali ya giza?

Bonyeza 'Dark Canvas' kupima tofauti ya kivuli juu ya slate kina na background giza.

Je, CSS yanayotokana sambamba na browsers wote?

Ndiyo. Inazalisha kiwango, W3C-sambamba sanduku-kivuli syntax mkono na desktop zote za kisasa na browsers mkononi.

Kitengeneza picha ya pasipotiPicha za ukubwa sahihi kwa pasipoti, viza na maombi ya kazi, na karatasi tayari kuchapishwa.
JPG kwenda PNGGeuza picha za JPG kuwa PNG.
PNG kwenda JPGGeuza picha za PNG kuwa faili ndogo za JPG.
Badilisha ukubwa na bana pichaBadilisha ukubwa wa picha hadi pikseli kamili, au ipunguze hadi KB 50, KB 100 au ukubwa wowote. Bila malipo, kwenye kivinjari chako.
Picha kwenda maandishi (OCR)Geuza maandishi ya Kibengali au Kiingereza kwenye picha au skani kuwa maandishi unayoweza kunakili.
HEIC kwenda JPGGeuza picha za HEIC za iPhone kuwa JPG inayofunguka kila mahali.
WebP kwenda JPGGeuza picha za WebP zilizohifadhiwa kutoka tovuti kuwa JPG inayofanya kazi kila mahali.
Kibadilishaji cha pichaBadilisha picha kati ya WebP, JPG na PNG, nyingi kwa wakati mmoja.
Picha kwenda Base64Geuza picha kuwa maandishi ya Base64, au Base64 kurudi kuwa picha.
Kichagua rangi kutoka pichaChagua rangi yoyote kutoka picha na upate misimbo ya HEX, RGB na HSL.
Kitengeneza faviconTengeneza favicon.ico na ukubwa wote wa aikoni za programu kutoka picha moja.
Ongeza maandishi kwenye pichaAndika maandishi kwenye picha ya mtindo wa mimi na uipakue.
Bila malipo kabisaHakuna ada, hakuna usajili
Faili hubaki za faraghaKila kitu hufanya kazi kwenye kivinjari chako
Rahisi katika lugha yakoInapatikana kwa lugha nyingi