CSS ಕ್ಲಿಪ್ ಪಾತ್ ಜನರೇಟರ್

ಸಂವಾದಾತ್ಮಕ ಪೂರ್ವವೀಕ್ಷಣೆಯೊಂದಿಗೆ ಬಹುಭುಜಾಕೃತಿಯನ್ನು ನಿರ್ಮಿಸಿ ಮತ್ತು ಕ್ಲಿಪ್-ಪಾತ್‌ಗಳನ್ನು ರೂಪಿಸಿ. ಹೀರೋ ಆಕಾರಗಳು ಮತ್ತು ಇಮೇಜ್ ಮಾಸ್ಕ್‌ಗಳಿಗೆ ಅದ್ಭುತವಾಗಿದೆ.

CSS Clip Path Generator

Live

Shape

CSS output

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

Key capabilities

ಸಂವಾದಾತ್ಮಕ ಪೂರ್ವವೀಕ್ಷಣೆಯೊಂದಿಗೆ ಬಹುಭುಜಾಕೃತಿಯನ್ನು ನಿರ್ಮಿಸಿ ಮತ್ತು ಕ್ಲಿಪ್-ಪಾತ್‌ಗಳನ್ನು ರೂಪಿಸಿ.
ನಿಮ್ಮ ಬ್ರೌಸರ್‌ನಲ್ಲಿ ರನ್ ಆಗುತ್ತದೆ
ಬಳಸಲು ಉಚಿತ

ಹೇಗೆ ಬಳಸುವುದು

ಮೊದಲೇ ಹೊಂದಿಸಲಾದ ಆಕಾರ ಅಥವಾ ಬಹುಭುಜಾಕೃತಿಯ ಬಿಂದುಗಳನ್ನು ಆರಿಸಿ.
ಅಗತ್ಯವಿರುವಂತೆ ಅಂಕಗಳನ್ನು ಹೊಂದಿಸಿ.
ಕ್ಲಿಪ್-ಪಾತ್ CSS ಅನ್ನು ನಕಲಿಸಿ.

How this tool works

ಮೊದಲೇ ಹೊಂದಿಸಲಾದ ಆಕಾರ ಅಥವಾ ಬಹುಭುಜಾಕೃತಿಯ ಬಿಂದುಗಳನ್ನು ಆರಿಸಿ.
ಅಗತ್ಯವಿರುವಂತೆ ಅಂಕಗಳನ್ನು ಹೊಂದಿಸಿ.
ಕ್ಲಿಪ್-ಪಾತ್ CSS ಅನ್ನು ನಕಲಿಸಿ.

Recommended settings

ಮೊದಲು ಡೀಫಾಲ್ಟ್ ಆಯ್ಕೆಗಳನ್ನು ಬಳಸಿ, ನಂತರ ಅಗತ್ಯವಿದ್ದರೆ ಹೊಂದಿಸಿ

Supported formats

Text / on-page input

File size and limits

ಬಹಳ ಸಂಕೀರ್ಣವಾದ ಬಹು-ಪದರದ ಪೂರ್ವವೀಕ್ಷಣೆಗಳು ಹಳೆಯ ಫೋನ್‌ಗಳಲ್ಲಿ ನಿಧಾನವಾಗಬಹುದು.

Privacy

ಬಣ್ಣ ಮತ್ತು CSS ಜನರೇಟರ್‌ಗಳು ನಿಮ್ಮ ಬ್ರೌಸರ್‌ನಲ್ಲಿ ಸಂಪೂರ್ಣವಾಗಿ ರನ್ ಆಗುತ್ತವೆ. ಪೂರ್ವವೀಕ್ಷಣೆಗಳು ಮತ್ತು ಪರಿವರ್ತನೆಗಳು ನಿಮ್ಮ ಶೈಲಿಗಳನ್ನು ಎಂದಿಗೂ ಅಪ್‌ಲೋಡ್ ಮಾಡುವುದಿಲ್ಲ.

Common use cases

ನಿಮಗೆ ಅಗತ್ಯವಿರುವಾಗ CSS ಕ್ಲಿಪ್ ಪಾತ್ ಜನರೇಟರ್ ಅನ್ನು ಬಳಸಿ: ಬಹುಭುಜಾಕೃತಿಯನ್ನು ನಿರ್ಮಿಸಿ ಮತ್ತು ಸಂವಾದಾತ್ಮಕ ಪೂರ್ವವೀಕ್ಷಣೆಯೊಂದಿಗೆ ಕ್ಲಿಪ್-ಪಾತ್‌ಗಳನ್ನು ರೂಪಿಸಿ.

Troubleshooting

ಪೇಸ್ಟ್ ಮಾಡಿದ ನಂತರ ಪೂರ್ವವೀಕ್ಷಣೆ ವಿಭಿನ್ನವಾಗಿ ಕಾಣುತ್ತದೆ

ನಿಮ್ಮ ಪುಟದಲ್ಲಿ ಸ್ಪರ್ಧಾತ್ಮಕ CSS ಅನ್ನು ಪರಿಶೀಲಿಸಿ (ಮರುಹೊಂದಿಕೆಗಳು, ಆನುವಂಶಿಕ ಬಣ್ಣಗಳು). ರಚಿಸಲಾದ ನಿಯಮವನ್ನು ಮೊದಲು ಪ್ರತ್ಯೇಕವಾದ ಸ್ಟೈಲ್‌ಶೀಟ್‌ಗೆ ನಕಲಿಸಿ.

FAQ

ಇದು ನನ್ನ CSS ಅನ್ನು ಅಪ್‌ಲೋಡ್ ಮಾಡುತ್ತದೆಯೇ?

ಇಲ್ಲ. ಜನರೇಟರ್‌ಗಳು ಮತ್ತು ಪರಿವರ್ತಕಗಳು ಲೈವ್ ಪೂರ್ವವೀಕ್ಷಣೆಯೊಂದಿಗೆ ನಿಮ್ಮ ಬ್ರೌಸರ್‌ನಲ್ಲಿ ರನ್ ಆಗುತ್ತವೆ.

ನನಗೆ ಖಾತೆ ಬೇಕೇ?

ಇಲ್ಲ. ಉಪಕರಣವನ್ನು ತೆರೆಯಿರಿ, ನಿಯಂತ್ರಣಗಳನ್ನು ಟ್ವೀಕ್ ಮಾಡಿ ಮತ್ತು CSS ಅನ್ನು ನಕಲಿಸಿ.