Skip to content

alehatsman/dashed-border-generator

ย 
ย 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

15 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

Dashed Border Generator

A simple online tool for creating custom dashed or dotted borders. Using CSS hack, this tool can simply increase space between dots, change dash length or distance between strokes.

How does it work? ๐Ÿš€

Native CSS properties don't support the customization of border-style. Therefore, we use a trick with an SVG image inside background-image property. The SVG features give us the ability to change the distance between dashed lines, set custom pattern, add dash offset or even change a line cap.

Generated SVG image is vector and it fills width and height of elements by 100%, so it doesn't matter what size elements have.

intro

Dependencies

License

The MIT License

Copyright (c) 2019-present, Artem Kovalchuk

About

Custom Dashed Border | Online CSS Generator ๐Ÿš€

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • HTML 63.7%
  • JavaScript 29.8%
  • CSS 6.5%