CSS ക്ലിപ്പ് പാത്ത് ജനറേറ്റർ

ഒരു ഇൻ്ററാക്ടീവ് പ്രിവ്യൂ ഉപയോഗിച്ച് പോളിഗോൺ നിർമ്മിക്കുകയും ക്ലിപ്പ്-പാത്ത് രൂപപ്പെടുത്തുകയും ചെയ്യുക. ഹീറോ ആകൃതികൾക്കും ഇമേജ് മാസ്‌ക്കുകൾക്കും മികച്ചതാണ്.

CSS Clip Path Generator

Live

CSS output

clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);

Key capabilities

  • ഒരു ഇൻ്ററാക്ടീവ് പ്രിവ്യൂ ഉപയോഗിച്ച് പോളിഗോൺ നിർമ്മിക്കുകയും ക്ലിപ്പ്-പാത്ത് രൂപപ്പെടുത്തുകയും ചെയ്യുക.
  • നിങ്ങളുടെ ബ്രൗസറിൽ പ്രവർത്തിക്കുന്നു
  • സൗജന്യമായി ഉപയോഗിക്കാം

എങ്ങനെ ഉപയോഗിക്കാം

  1. ഒരു പ്രീസെറ്റ് ആകൃതി അല്ലെങ്കിൽ പോളിഗോൺ പോയിൻ്റുകൾ തിരഞ്ഞെടുക്കുക.
  2. ആവശ്യാനുസരണം പോയിൻ്റുകൾ ക്രമീകരിക്കുക.
  3. ക്ലിപ്പ്-പാത്ത് CSS പകർത്തുക.

How this tool works

  1. ഒരു പ്രീസെറ്റ് ആകൃതി അല്ലെങ്കിൽ പോളിഗോൺ പോയിൻ്റുകൾ തിരഞ്ഞെടുക്കുക.
  2. ആവശ്യാനുസരണം പോയിൻ്റുകൾ ക്രമീകരിക്കുക.
  3. ക്ലിപ്പ്-പാത്ത് CSS പകർത്തുക.

Recommended settings

  • ആദ്യം ഡിഫോൾട്ട് ഓപ്ഷനുകൾ ഉപയോഗിക്കുക, തുടർന്ന് ആവശ്യമെങ്കിൽ ക്രമീകരിക്കുക

Supported formats

Text / on-page input

File size and limits

  • വളരെ സങ്കീർണ്ണമായ മൾട്ടി-ലെയർ പ്രിവ്യൂകൾ പഴയ ഫോണുകളിൽ മന്ദഗതിയിലായേക്കാം.

Privacy

നിറവും CSS ജനറേറ്ററുകളും പൂർണ്ണമായും നിങ്ങളുടെ ബ്രൗസറിൽ പ്രവർത്തിക്കുന്നു. പ്രിവ്യൂകളും പരിവർത്തനങ്ങളും ഒരിക്കലും നിങ്ങളുടെ ശൈലികൾ അപ്‌ലോഡ് ചെയ്യുന്നില്ല.

Common use cases

  • നിങ്ങൾക്ക് ആവശ്യമുള്ളപ്പോഴെല്ലാം CSS ക്ലിപ്പ് പാത്ത് ജനറേറ്റർ ഉപയോഗിക്കുക: ഒരു ഇൻ്ററാക്ടീവ് പ്രിവ്യൂ ഉപയോഗിച്ച് പോളിഗോൺ നിർമ്മിക്കുകയും ക്ലിപ്പ്-പാത്ത് രൂപപ്പെടുത്തുകയും ചെയ്യുക.

Troubleshooting

ഒട്ടിച്ചതിന് ശേഷം പ്രിവ്യൂ വ്യത്യസ്തമായി കാണപ്പെടുന്നു

നിങ്ങളുടെ പേജിൽ മത്സരിക്കുന്ന CSS പരിശോധിക്കുക (റീസെറ്റുകൾ, പാരമ്പര്യ നിറങ്ങൾ). ജനറേറ്റ് ചെയ്ത നിയമം ആദ്യം ഒരു ഒറ്റപ്പെട്ട സ്റ്റൈൽഷീറ്റിലേക്ക് പകർത്തുക.

പതിവ് ചോദ്യങ്ങൾ

ഇത് എൻ്റെ CSS അപ്‌ലോഡ് ചെയ്യുന്നുണ്ടോ?

നമ്പർ. ജനറേറ്ററുകളും കൺവെർട്ടറുകളും തത്സമയ പ്രിവ്യൂ ഉപയോഗിച്ച് നിങ്ങളുടെ ബ്രൗസറിൽ പ്രവർത്തിക്കുന്നു.

എനിക്ക് ഒരു അക്കൗണ്ട് ആവശ്യമുണ്ടോ?

ഇല്ല. ടൂൾ തുറക്കുക, നിയന്ത്രണങ്ങൾ മാറ്റുക, CSS പകർത്തുക.

ബന്ധപ്പെട്ട ടൂളുകൾ