☰
HTML Tools
Character Map
HTML Formatter / Minifier
HTML Encoder
HTML Tag Cleaner
Newline Converter
CSS Tools
Colour Picker
CSS Minifier
Box Shadow Generator
Flexbox Helper
Transition Timings
JavaScript Tools
JSON Formatter
Regex Tester
JWT Decoder
Base64 Encoder / Decoder
SEO Tools
Meta Tag Generator
Robots.txt Tester
Utilities
UUID Generator
Timestamp Converter
Password Generator
Lorem Ipsum Generator
Case Converter
HTML Tools
Character Map
HTML Formatter / Minifier
HTML Encoder
HTML Tag Cleaner
Newline Converter
CSS Tools
Colour Picker
CSS Minifier
Box Shadow Generator
Flexbox Helper
Transition Timings
JavaScript Tools
JSON Formatter
Regex Tester
JWT Decoder
Base64 Decoder
SEO Tools
Meta Tag Generator
Robots.txt Tester
Utilities
UUID Generator
Timestamp Converter
Password Generator
Lorem Ipsum Generator
Case Converter
Flexbox Helper Tool
Visually experiment with Flexbox layout and copy the generated CSS.
Container Settings
Display:
flex
inline-flex
Flex Direction:
row
column
row-reverse
column-reverse
Justify Content:
flex-start
center
space-between
space-around
space-evenly
Align Items:
stretch
flex-start
center
flex-end
baseline
Align Content:
stretch
flex-start
center
flex-end
space-between
space-around
Wrap:
nowrap
wrap
wrap-reverse
🔄 Reset Layout
Flex Items
➕ Add Item
Selected Item
Order:
Flex Grow:
Flex Shrink:
Flex Basis (%):
Align Self:
auto
flex-start
center
flex-end
stretch
baseline
Container CSS
Item CSS
