CSS3 పరివర్తన జనరేటర్

సున్నితమైన పారదర్శకత పరివర్తన

పాపులర్ ప్రీసెట్ లు

Faade Effect

సున్నితమైన పారదర్శకత పరివర్తన

స్కేల్ ప్రభావం

hoover మీద ఎలిమెంట్ ని Resize చేయండి

తిప్పు ప్రభావం

ఎలిమెంట్ ని హోవర్ మీద తిప్పండి

స్లైడ్ ఎఫెక్ట్

ఎలిమెంట్ పొజిషన్ ని మూవ్ చేయండి

రంగు మార్పు

నేపథ్య రంగు పరివర్తన

పరివర్తనల గురించి

CSS పరివర్తనలు ఒక నిర్దిష్ట కాలవ్యవధిలో ప్రాపర్టీ విలువలను సజావుగా మార్చడానికి మిమ్మల్ని అనుమతిస్తాయి.

సాధారణంగా యానిమేటెడ్ లక్షణాలలో ఇవి ఉన్నాయి:

  • వెడల్పు, ఎత్తు
  • మార్జిన్, ప్యాడింగ్
  • ఓపాసిటీ, రంగు
  • transform (scale, rotate, translate)
  • background-color

ప్రో చిట్కా: అన్ని మార్పులను యానిమేట్ చేయడానికి 'ఆల్ ప్రాపర్టీస్' ఆప్షన్ ఉపయోగించండి.

Preview

HOVER ME

జనరేట్ చేసిన కోడ్

.element { transition-property: all; transition-duration: 300ms; transition-timing-function: ease; transition-delay: 0ms; }  .element:hover { /* Hover styles will be generated here */ }

పరివర్తన నియంత్రణలు

300
0

హోవర్ ప్రభావాలు

100%
100%
0px
0px
8px
8px

Related Tools

CSS కన్వర్టర్ కు తక్కువ

మీ లెస్ కోడ్ ని CSS గా మార్చండి. వేగవంతమైన, సులభమైన మరియు సురక్షితమైనది.

CSS Minifier

ప్రొఫెషనల్ కచ్చితత్వంతో మీ CSS కోడ్ ని కంప్రెస్ చేయండి మరియు ఆప్టిమైజ్ చేయండి

Sass to CSS Converter

మీ సాస్ కోడ్ ను CSS గా మార్చండి. వేగవంతమైన, సులభమైన మరియు సురక్షితమైనది.

JavaScript Minifier

ప్రొఫెషనల్-గ్రేడ్ మినిఫికేషన్ తో మీ జావా స్క్రిప్ట్ కోడ్ ను కుదించండి మరియు ఆప్టిమైజ్ చేయండి. ఫైల్ పరిమాణాన్ని తగ్గించండి, లోడ్ సమయాలను మెరుగుపరచండి మరియు మీ వెబ్ అనువర్తనాల కోసం పనితీరును మెరుగుపరచండి.

CSS నుంచి LESS కన్వర్టర్ వరకు

వేరియబుల్స్, నెస్టింగ్ మరియు మరెన్నోతో మీ CSS కోడ్ ని లెస్ గా మార్చండి. వేగవంతమైన, సులభమైన మరియు సురక్షితమైనది.

హెక్స్ నుండి దశాంశానికి

హెక్సాడెసిమల్ సంఖ్యలను అప్రయత్నంగా దశాంశంగా మార్చండి