Foundation CSS Utilities Complete Reference Improve Improve Like Article Like Save Share Report Foundation CSS has different types of utility like Prototyping Utilities Sizing is used to give width and height to an element. There is a various utility that helps to make it easy for us. Complete list Foundation CSS Utility are listed below: Foundation CSS Prototyping Utilities Foundation CSS Prototyping Utilities Enable Prototype Mode Foundation CSS Prototyping Utilities Responsive breakpoints Foundation CSS Prototyping Utilities Component Styling Foundation CSS Prototyping Arrow Utility Foundation CSS Prototyping Utilities Separator Foundation CSS Prototyping Utilities Font Styling Foundation CSS Prototyping Utilities List Styling Foundation CSS Prototyping Utilities Text Helpers Foundation CSS Prototyping Utilities Margin Helpers Foundation CSS Prototyping Utilities Padding Helpers Foundation CSS Prototyping Utilities Sizing Foundation CSS Prototyping Utilities Border box Foundation CSS Prototyping Utilities Border none Foundation CSS Prototyping Utilities Display Classes Foundation CSS Prototyping Utilities Positioning Foundation CSS Prototyping Utilities Overflow Foundation CSS Prototyping Utilities Sass Mixin Helpers Foundation CSS Prototyping Utilities Sass Reference Foundation CSS Flexbox Utilities Foundation CSS Flexbox Utilities Source Ordering Foundation CSS Flexbox Utilities Helper Mixins Foundation CSS Flexbox Utilities Sass Reference Foundation CSS Visibility Classes Foundation CSS Visibility Classes Show by Screen Size Foundation CSS Visibility Classes Hide by Screen Size Foundation CSS Visibility Classes Orientation Detection Foundation CSS Visibility Classes Accessibility Foundation CSS Visibility Classes Sass Reference Foundation CSS Float Classes Foundation CSS Float Left/Right Classes Foundation CSS Float Center Class Below example will give you a brief idea about the Utilities of Foundation CSS: Example: HTML <html> <head> <link crossorigin="anonymous" rel="stylesheet" href= "https://cdn.jsdelivr.net/npm/foundation-sites@6.7.4/dist/css/foundation.min.css"> <link rel="stylesheet" href= "https://get.foundation/sites/docs/assets/css/docs.css"> </head> <body> <h3 style="color:green">GeeksforGeeks</h3> <h5>Foundation CSS Prototyping Utilities Separator</h5> <br> <h3 class="separator-left">Geeks</h3> <h3 class="separator-center">for</h3> <h3 class="separator-right">Geeks</h3> </body> </html> Output: Foundation CSS Utilities Last Updated : 12 May, 2022 Like Article Save Article Previous Foundation CSS Float Classes Share your thoughts in the comments Add Your Comment Please Login to comment...