Search Results for "css layout templates" - Page 4
Sort By:
Showing 160 open source projects for "css layout templates"
View related business solutions-
MongoDB Atlas runs apps anywhereMongoDB Atlas gives you the freedom to build and run modern applications anywhere—across AWS, Azure, and Google Cloud. With global availability in over 115 regions, Atlas lets you deploy close to your users, meet compliance needs, and scale with confidence across any geography.
-
Fully Managed MySQL, PostgreSQL, and SQL ServerCloud SQL handles your database ops end to end, so you can focus on your app.
-
1
frontend-mentor-challenges
My submissions for the Frontend Mentor Challenges
The frontend-mentor-challenges repository contains the author’s submissions to the platform Frontend Mentor — which offers structured UI/UX layout challenges (landing pages, components, form designs) for front-end developers. The codebase shows solutions in HTML, CSS, Javascript, with each challenge typically including an original design file plus the author’s implementation. It’s a great way to practice responsive layouts, CSS grid/flexbox mastery, UI refinement, and build portfolio-worthy front-end snapshots. ... -
2
Lanyon
A content-first, sliding sidebar theme for Jekyll
Lanyon is an unassuming Jekyll theme that places content first by tucking away navigation in a hidden drawer. It’s based on Poole, the Jekyll butler. Lanyon is a theme built on top of Poole, which provides a fully furnished Jekyll setup—just download and start the Jekyll server. See the Poole usage guidelines for how to install and use Jekyll. -
3
UnCSS
Remove unused styles from CSS
UnCSS is a tool that removes unused CSS from your stylesheets. It works across multiple files and supports Javascript-injected CSS. UnCSS cannot be run on non-HTML pages, such as templates or PHP files. If you need to run UnCSS against your templates, you should probably generate example HTML pages from your templates, and run uncss on those generated files; or run a live local dev server, and point uncss at that. -
4
CSS Element Queries
High-speed element dimension/media queries in valid css
...No interval/timeout detection like in most resize sensor out there. It's truly event-based. Automatically discovers new DOM elements. No need to call javascript manually. All CSS selectors available. It uses the normal attribute selector. Min-width, min-height, max-width and max-height supported. It works for all layout modifications, HTML (innerHTML etc), inline styles, DOM mutation, CSS3 transitions, fluid layout changes (parent changes too), pseudo classes (:hover etc), window resizes, etc. -
Full-stack observability with actually useful AI | Grafana CloudBuilt on open standards like Prometheus and OpenTelemetry, Grafana Cloud includes Kubernetes Monitoring, Application Observability, Incident Response, plus the AI-powered Grafana Assistant. Get started with our generous free tier today.
-
5
NES.css
NES-style CSS Framework
...NES.css only provides components. You will need to define your own layout. The recommended font for NES.css is Press Start 2P. However, Press Start 2P only supports English characters. When you're using this framework with any language other than English, please use another font. Follow the Google Fonts instructions about how to include them. NES.css only requires CSS and doesn't depend on any JavaScript. -
6
remark
A simple, in-browser, markdown-driven slideshow tool
A simple, in-browser, Markdown-driven slideshow tool targeted at people who know their way around HTML and CSS. If your ideal slideshow creation workflow contains any of the following steps, just write what's on your mind, do some basic styling, easily collaborate with others, share with and show to everyone, then remark might be perfect for your next slideshow! Focus on the content, expressing yourself in next to plain text not worrying what flashy graphics and disturbing effects to put... -
7
Chartist.js
Simple responsive charts
...Of course there are hundreds of other great charting libraries but after using them there were always tweaks you would have wished for that were not included. Are you planning to use Chartist to create a nice Dashboard or Admin UI? Don't loose any time and kickstart your development using the awesome templates by Creative Tim. They include Chartist and come with awesome chart styles! Specifying the style of your chart in CSS is not only cleaner but also enables you to use awesome CSS animations and transitions to be applied to your SVG elements! Note that CSS3 animations on SVG CSS attributes are not supported on all browsers and the appearance may vary. -
8
Shards UI
Bootstrap 4 UI kit packed with extra templates and components
A free and modern UI toolkit for web makers based on the popular Bootstrap 4 (final) framework. Shards is built with performance in mind having a small footprint and weighting ~13kb minified and gzipped. With Bootstrap 4 at its core, Shards is responsive by default being able to adapt and reflow its layout to any screen size. Everything new in Shards is well documented so you can start building beautiful interfaces as soon as possible. Each component was designed from scratch and comes... -
9
Simditor
An easy and fast WYSIWYG editor
...Only supported by Firefox and Chrome. simditor.css is compiled from '.scss' source file using Sass. If you want to change the style of Simditor, you can simply change simditor.scss and reproduce the CSS file. .editor-style is the layout style of the textarea. Customize this file if you want a different text format. You can also create your own extensions for Simditor. -
AI-generated apps that pass security reviewRetool lets you generate dashboards, admin panels, and workflows directly on your data. Type something like “Build me a revenue dashboard on my Stripe data” and get a working app with security, permissions, and compliance built in from day one. Whether on our cloud or self-hosted, create the internal software your team needs without compromising enterprise standards or control.
-
10
Pjax module
Easily enable fast Ajax navigation on any website
...Pjax does not rely on other libraries, like jQuery or similar. It is written entirely in vanilla JS. Pjax loads pages using AJAX and updates the browser's current URL using pushState() without reloading your page's layout or any resources (JS, CSS), giving a fast page load. It works with all permalinks and can update all the parts of the page you want (including HTML metas, title, and navigation state). It listens to every click on links you want (by default all of them). When an internal link is clicked, Pjax fetches the page's HTML via AJAX. -
11
Stisla
Free Bootstrap Admin Template
Stisla will help you to speed up your project, and design your own dashboard UI and the users will love it. Integrated with 30+ third-party libraries and has many components, you will easily to create a dashboard layout. Don't worry about the gadget you have. Stisla is very suitable for every platform. Written with HTML5 and CSS3 and supported by most modern browsers. We provide some javascript APIs to interact with some components more easily. All HTML pages are free of errors, because they... -
12
Jasny Bootstrap
The missing components for your favorite front-end framework
Jasny Bootstrap is an extension to vanilla Bootstrap, adding a number of features and components. The aim of Jasny Bootstrap is to provide all the required features for building highly interactive web applications for desktop and mobile. As of version 3.1.0 Jasny Bootstrap is no longer bundled with vanilla Bootstrap. You should load vanilla Bootstrap's CSS before this extension. Jasny Bootstrap has a few easy ways to quickly get started, each one appealing to a different skill level and use... -
13
BackstopJS
Catch CSS curve balls
Visual regression testing for web apps. Supports screen rendering with Chrome-headless. Add your own interactions with the Playwright and Puppeteer scripting. BackstopJS automates visual regression testing of your responsive web UI by comparing DOM screenshots over time. -
14
css3-
CSS3 implements various 3D && 3D planetary animation effects
...The repository focuses on helping front-end developers understand how to implement sophisticated UI effects using native browser features rather than heavy external libraries. It covers a wide range of topics including animations, layout tricks, transitions, and creative visual compositions. The project is structured as a reference-style showcase where each example isolates a specific technique, making it easy to study and adapt into real projects. Its educational value lies in revealing non-obvious CSS behaviors and encouraging deeper mastery of the styling layer. ... -
15
MixItUp 3
Library for animated filtering, sorting, insertion, removal and more
MixItUp is a high-performance, dependency-free library for animated DOM manipulation, giving you the power to filter, sort, add and remove DOM elements with beautiful animations. MixItUp plays nice with your existing HTML and CSS, making it a great choice for responsive layouts and compatible with inline-flow, percentages, media queries, flexbox and more. MixItUp is open source and free to use for non-commercial, educational and non-profit use. For use in commercial projects, a commercial... -
16
Shards Dashboard UI Kit
A beautiful Bootstrap 4 admin dashboard templates pack
A high-quality & free Bootstrap admin dashboard template pack that comes with lots of templates and components. Based on Bootstrap 4, Shards Dashboard Lite is fully responsive and capable to adapt its layout to any viewport size. We followed the same practices when building Shards Dashboard Lite as the original Shards UI kit. This means that performance is excellent by adding a thin layer that’s only ~4kb mingz. Fully documented components and features were one of the key points when building Shards Dashboard Lite so that you can focus on building your ideal product with ease. ... -
17
express-vue
Vue rendering engine for Express.js. Use .Vue files as templates
A Simple way of using Server Side rendered Vue.js 2.0+ natively in Express using streams. If you want to use vue.js and setup a large-scale web application that is server-side rendered, using Node+Express, but you want to use all the fantastic tools given to you by Vue.js. Then this is the library for you. The idea is simple use Node+Express for your Controller and Models, and Vue.js for your Views.. you can have a secure server-side rendered website without all the hassle. Your Controller... -
18
Velocity
Accelerated JavaScript animation
...Although Velocity works alongside jQuery, it uses its own animation stack that delivers its performance through two underlying principles: 1) synchronize the DOM → tween stack to minimize layout thrashing, and 2) cache values to minimize DOM querying. -
19
Masonry
A cascading grid layout plugin
Masonry is a JavaScript grid layout library. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet. All sizing and styling of items is handled by your own CSS. tem sizes can be set with percentages for responsive layouts. With the masonry layout mode, set percentage-width columnWidth with element sizing. -
20
Evil Icons
Simple and clean SVG icon pack with the code to support Rails, Sprocke
Simple and clean SVG icon pack with the code to support Rails, Sprockets, Node.js, Gulp, Grunt and CDN. Free ‘plug and play’ set of SVG icons designed specifically for web projects. Available as a Ruby gem, a Node.js package and /Gulp plugins. Just use icon names with your templates and styles — and all the rest will be done automagically. Every icon has the .icon class and its modifier including the icon name. For example, the Facebook icon has the .icon--ei-sc-facebook modifier. In order... -
21
grd
A CSS grid framework using Flexbox. Only 321 bytes (Gzipped)
A CSS grid framework using Flexbox. Simple and provides just 2 base classes Grid and Cell and some modifiers. Light-weight, only 321 bytes (Gzipped). Flexible, easy-to-use Flexbox features. Flexible Box Layout Module and calc() as CSS unit values used in Grd are available on modern browsers (Chrome, Firefox, Safari, Opera, Edge, and IE11). -
22
PurpleAdmin-Free-Admin-Template
Purple Admin is one of the most stylish Bootstrap admin dashboards
Purple Admin is one of the most stylish Bootstrap admin dashboard you can get hands on. With its beautifully crafted captivating design and well-structured code. Featuring 4 different sample dashboards, 5+ sample layout styles, and over 20 sample pages, Purple dashboard makes development faster and easier. This Admin template comes with documentation and priority support for 12 whole months. Our templates are all regularly updated, making sure you get the best template possible. Forget about boring dashboards and grab the Purple admin to kickstart your new project!. -
23
Isotope
Filter and sort layouts
Include the Isotope .js file in your site. Isotope works on a container element with a group of similar child items. All sizing of items is handled by your CSS. You can use Isotope as a jQuery plugin. You can use Isotope with vanilla JS. You can initialize Isotope in HTML, without writing any JavaScript. All options are optional, but itemSelector is recommended. Layout modes have their own separate options. We recommend always setting itemSelector. itemSelector is useful to exclude sizing elements or other elements that are not part of the layout. ... -
24
TACHYONS
Functional CSS for humans
Create fast loading, highly readable, and 100% responsive interfaces with as little CSS as possible. Everything should be 100% responsive. Everything should be readable on any device. Everything should be as fast as possible. Designing in the browser should be easy. It should be easy to change any interface or part of an interface without breaking any existing interfaces. Doing one thing extremely well promotes reusability and reduces repetition. Documentation helps promote reusability and... -
25
Cleaver
30-second slideshows for hackers
...Cleaver supports several basic options that allow you to further customize the look and feel of your presentation, including author info, stylesheets, and custom templates. Cleaver has substantial theme support to give you more fine-grained control over your presentation, similar to options. Instead of manually specifying a stylesheet, template, layout, and others, you can specify a single theme containing each of these assets. Cleaver comes with a stylesheet that looks good by default, but you can extend it at your heart's desire. ...
