CSS gradienta redaktors: ģenerējiet CSS kodu gradienta fonam [Mac]

click fraud protection

CSS ir viss, kas nosaka, kā jūsu vietne vai lietotne parādīsies gala lietotājam, taču pamata lapas rakstīšana var aizņemt kādu laiku. Droši vien tāpēc jūs atradīsit daudz auto CSS kodu ģeneratoru, kas ļauj pievienot efektus, izveidot objektus vai vienkāršus slīpumus. CSS gradienta redaktors ir bezmaksas Mac lietotne, kas ļauj jums izveidot gradienta fonu. Lietotne nodrošina jums vienkāršu GUI, ļaujot izvēlēties jebkuru gradienta krāsu, pievienot ne vairāk kā piecas pieturas un atlasīt, kur atrodas katra pietura. Gradients var būt vertikāls vai horizontāls, un lietotne ļauj jums izveidot iestatījumus un ģenerē CSS kods, kas savietojams ar pārlūku Chrome, Firefox, Safari, Internet Explorer 10, Opera, visi atbilst W3C standarta. Krāsas var ievadīt kā RGB, HSL un Hex kodus.

Lietotne tiek ielādēta ar vienkāršu divu ēnu gradientu. Tam ir viens logs, kas sadalīts četrās sadaļās, kur abās labajā pusē redzamajā kodā tiek parādīts kods un priekšskatīts gradients, kad to izveidojat. Kreisajā pusē esošajās sadaļās varat pievienot iestatījumus un izveidot vai rediģēt gradientu.

instagram viewer
CSS gradienta redaktors

Jūs galvenokārt strādājat ar apakšējo kreiso sadaļu. Atkarībā no tā, kāda veida gradientu vēlaties izveidot, noklikšķiniet uz pogas X ass (vertikālam gradientam) vai Y ass (horizontālam gradientam). Noklikšķiniet uz krāsu lodziņa Augšējā krāsa, un izvēlieties, kura krāsa parādīsies gradienta augšdaļā vai kreisajā malā. Lai pievienotu papildu pieturu, pārbaudiet Pietura rūtiņa tieši zem Augšējā krāsa, izvēlieties punktu, kur sāksies otrā krāsa, pārvietojot slīdni uz tā priekšpusi. Sekojiet paraugam, lai pievienotu papildu pieturvietas. Pēc tam atlasiet Apakšā krāsa. Efekti tiks apskatīti, un kods tiks atjaunināts, veicot izmaiņas.

CSS Gradient Editor pievieno pieturvietas

Ja vēlaties saglabāt izveidoto gradientu, noklikšķiniet uz Saglabāt sākotnējo iestatījumu poga un gradients tiks saglabāts. Kodu var nokopēt un izmantot jūsu CSS lapā, neprasot nekādas modifikācijas.

Iegūstiet CSS Gradient Editor no Mac App Store

watch instagram story