CSS Transition Properties

backgroundbackground-colorbackground-imagebackground-positionbackground-sizeborderborder-bottomborder-bottom-colorborder-bottom-left-radiusborder-bottom-right-radiusborder-bottom-widthborder-colorborder-imageborder-image-outsetborder-image-sliceborder-image-sourceborder-image-widthborder-leftborder-left-colorborder-left-widthborder-radiusborder-rightborder-right-colorborder-right-widthborder-spacingborder-topborder-top-colorborder-top-left-radiusborder-top-right-radiusborder-top-widthborder-widthbottombox-shadowclipclip-pathcolorcolumn-countcolumn-gapcolumn-rulecolumn-rule-colorcolumn-rule-widthcolumn-widthcolumnsfilterflexflex-basisflex-growflex-shrinkfontfont-sizegapgridgrid-auto-columnsgrid-column-gapgrid-gapgrid-row-gapgrid-templategrid-template-columnsgrid-template-rowsheightleftletter-spacingline-heightmarginmargin-bottommargin-leftmargin-rightmargin-topmask-imagemask-positionmask-sizemax-heightmax-widthmin-heightmin-widthobject-positionopacityoutlineoutline-coloroutline-offsetoutline-widthpaddingpadding-bottompadding-leftpadding-rightpadding-topperspectiveperspective-originrightrow-gaptext-decorationtext-decoration-colortext-decoration-thicknesstext-indenttext-shadowtoptransformtransform-originvertical-alignwidthword-spacingz-index

CSS border-left-color transition property


with use of the border-left-color property you can create smooth transition between two different border-left-color property values.

Values

This is the value you will use with border-left-color property

ValueDescription
colorSpecifies the color of the top border. Look at CSS Color Values for the list of possible color values.
transparentAllows the border to be transparent, though it may occupy the space set by the border-width property.

Example


*:hover {
   
border-left-color
 
color | transparent
}

References