- 72
- 345 502
AutomaticCSS & Frames
United States
เข้าร่วมเมื่อ 5 เม.ย. 2022
Automatic.css (ACSS) is an intelligent and forward-thinking CSS utility framework. It features a seamless integration between utility classes and custom properties (CSS Variables) with advanced features like responsive typography and spacing, scale-based typography, and more.
Automatic.css was initially developed for Oxygen websites on the Wordpress platform but is being adapted to work in other Wordpress page builders such as Bricks, Zion, and more. We're also adapting the framework to work with Woocommerce, Gutenberg, and even non-Wordpress websites.
Frames is a real time wireframing tool, design-ready development system, and accessible component library that empowers you to build beautiful custom websites in half the time with zero limits on your creativity. It's seamlessly integrated with ACSS, built with BEM class organization, fully HTML5 compliant, and accessible.
Automatic.css was initially developed for Oxygen websites on the Wordpress platform but is being adapted to work in other Wordpress page builders such as Bricks, Zion, and more. We're also adapting the framework to work with Woocommerce, Gutenberg, and even non-Wordpress websites.
Frames is a real time wireframing tool, design-ready development system, and accessible component library that empowers you to build beautiful custom websites in half the time with zero limits on your creativity. It's seamlessly integrated with ACSS, built with BEM class organization, fully HTML5 compliant, and accessible.
Important Message: ACSS Licensing/Pricing Plans Are Changing!
We have a very important message regarding ACSS licenses and pricing plans that we hope you'll be excited about.
IMPORTANT NOTE: If you're an existing ACSS customer, you'll see this change reflected in your account at some point in January. There are some technical hurdles we have to get through to make this happen. For new customers it's effective immediately.
Interested in using Automatic.css on your sites and accessing the private ACSS support and strategy community? Get a license here: automaticcss.com
Interested in using Frames on your sites and accessing the private Frames support and strategy community? Get a license here: getframes.io
Want more helpful dev tutorials and agency-related trainings? Check out Kevin's channel: www.youtube.com/@Gearyco
IMPORTANT NOTE: If you're an existing ACSS customer, you'll see this change reflected in your account at some point in January. There are some technical hurdles we have to get through to make this happen. For new customers it's effective immediately.
Interested in using Automatic.css on your sites and accessing the private ACSS support and strategy community? Get a license here: automaticcss.com
Interested in using Frames on your sites and accessing the private Frames support and strategy community? Get a license here: getframes.io
Want more helpful dev tutorials and agency-related trainings? Check out Kevin's channel: www.youtube.com/@Gearyco
มุมมอง: 2 202
วีดีโอ
ACSS 101.18 - Columns & Masonry Layouts
มุมมอง 1.9K14 วันที่ผ่านมา
Columns and Masonry layouts can't really get any easier than with ACSS' utility classes and recipes. This quick tutorial will show you how to get the most out of these utilities. Docs: automaticcss.com/docs/css-columns/ automaticcss.com/docs/masonry-layouts/ automaticcss.com/docs/column-recipes/ Interested in using Automatic.css on your sites and accessing the private ACSS support and strategy ...
ACSS 101.17 - Advanced Content Grid
มุมมอง 2.6K2 หลายเดือนก่อน
This is a follow up to Lesson 16, demonstrating nested content grids and the use of content grids in dynamic situations like blog post templates where the layout can be controlled using utility classes from the block editor. Interested in using Automatic.css on your sites and accessing the private ACSS support and strategy community? Get a license here: automaticcss.com Interested in using Fram...
Textures & Overlays (Experimental): Demo & Walkthrough
มุมมอง 2.7K2 หลายเดือนก่อน
ACSS 3.1.2 introduces a brand new, very powerful feature called Textures & Overlays. This feature allows you to define custom texture styles that can be used as backgrounds or overlays (or both) to bring more life and layering to your web designs. In this video, Kevin will demo the new feature and walk you through what each setting does so you can start to experiment with Textures & Overlays yo...
ACSS 101.16 - Content Grid (Basics)
มุมมอง 3.3K2 หลายเดือนก่อน
This video covers the basics of ACSS' content grid feature. Please make sure you read the official content grid documentation for additional details: automaticcss.com/docs/content-grid/ Interested in using Automatic.css on your sites and accessing the private ACSS support and strategy community? Get a license here: automaticcss.com Interested in using Frames on your sites and accessing the priv...
ACSS 101:15 - Variable Grid Layouts
มุมมอง 2.5K4 หลายเดือนก่อน
Variable Grids are automatically responsive grids that auto-fill themselves with elements based on the minimum allowed width of items. Learn more about variable grids: automaticcss.com/docs/variable-grid/ Interested in using Automatic.css on your sites and accessing the private ACSS support and strategy community? Get a license here: automaticcss.com Interested in using Frames on your sites and...
ACSS 101:14: Auto Grid Layouts
มุมมอง 3.9K5 หลายเดือนก่อน
Auto Grid allows users to create automatically responsive grid, control the aggressiveness of the stacking behavior, and even determine when grids stack down to a specific pixel value. In this video you'll learn how Auto Grids work, pros and cons, and common issues to look out for. Interested in using Automatic.css on your sites and accessing the private ACSS support and strategy community? Get...
ACSS 101.13: Traditional Grid Layouts
มุมมอง 4.5K5 หลายเดือนก่อน
Learn more about CSS Grid: th-cam.com/video/uZBUdMBCaDQ/w-d-xo.htmlsi=laHo_rL6ibtKD-tB Learn about Flexbox: th-cam.com/video/k46Cft746IM/w-d-xo.htmlsi=ivk_4EVbm9pBF9Qs Interested in using Automatic.css on your sites and accessing the private ACSS support and strategy community? Get a license here: automaticcss.com Interested in using Frames on your sites and accessing the private Frames support...
ACSS 101.12: The Official ACSS Workflow (BEM + AUTOBEM)
มุมมอง 6K5 หลายเดือนก่อน
There are essentially three workflows that people use with page builders: 1. ID Styling (01:00) 2. Utility-First (11:28) 3. Custom Classes (Official Approach - 19:27) This video will show you the pros and cons of all three, and teach you the officially proposed workflow (Method #3 using BEM and AUTOBEM). Here are some additional videos to help you go deeper on this topic: BEM 101 - th-cam.com/v...
ACSS 101.11: Link Styling & Focus Styling (Global & Classes)
มุมมอง 2.5K5 หลายเดือนก่อน
This lesson covers default link styling, changing links or groups of links with link classes, default focus styling, and changing the focus style of focusable elements or groups of focusable elements with focus classes. Interested in using Automatic.css on your sites and accessing the private ACSS support and strategy community? Get a license here: automaticcss.com Interested in using Frames on...
ACSS 101.10: All Things Buttons (Styles, Variants, Mixins, Recipes, & Custom Buttons)
มุมมอง 5K6 หลายเดือนก่อน
ACSS has the most robust and powerful button system of any framework or page builder in existence. This lesson will show you how to: - Apply button styles to links or button elements - Apply button style variants (dark and light) - Apply the outline variant - Make outline buttons the default - Set global styles (shared styles) for all buttons - Apply neutral, black, and white styles - Customize...
ACSS 101.09: Headers, Sticky Headers, & Offsets
มุมมอง 5K6 หลายเดือนก่อน
This video covers: - Header Padding with variables or utility classes - Basic header structure - Sticky & Overlay headers in Bricks - Challenges with Sticky & Overlay Headers - Header Height - Auto Content Offset - Auto Scroll Offset - How to turn off content offset with a utility class - How to turn off content offset with programmatic selectors - How to turn off content offset with a data att...
ACSS 101.08: Color Scheme & "Dark Mode"
มุมมอง 4.1K6 หลายเดือนก่อน
This lesson covers: - How to choose alternate versions of each color in the ACSS color system. - How to automatically swap color scheme based on OS preference. - How to manually swap a group of elements to the alternate scheme. - How to manually lock a group of elements to the main scheme. - How to programmatically lock elements to the main scheme. - How to deploy a color scheme toggle switch. ...
ACSS 101.07.P2: Background & Text Color (Contextual Approach + Auto Color Relationships)
มุมมอง 3.9K6 หลายเดือนก่อน
ACSS 101.07.P2: Background & Text Color (Contextual Approach Auto Color Relationships)
ACSS 101.07.P1: Background & Text Color (Traditional Approach)
มุมมอง 3.6K6 หลายเดือนก่อน
There are two approaches to setting and managing background and text color in Automatic.css. In Part 01, I'll show you the traditional approach. In Part 02, I'll show you the new "contextual" approach. You can use either approach, but the new contextual approach offers a lot of benefits over the traditional approach. The only caveat is that it might take you a couple explanations and some exper...
ACSS 101.04: Fluid Responsive, Scale-Based, Contextual Spacing
มุมมอง 6K7 หลายเดือนก่อน
ACSS 101.04: Fluid Responsive, Scale-Based, Contextual Spacing
ACSS 101.03: Fluid Responsive, Scale-Based Typography
มุมมอง 6K7 หลายเดือนก่อน
ACSS 101.03: Fluid Responsive, Scale-Based Typography
ACSS 101.02: Establishing & Manipulating Your Site's Content Width
มุมมอง 9K7 หลายเดือนก่อน
ACSS 101.02: Establishing & Manipulating Your Site's Content Width
ACSS 101.01: Awesomeness Out of The Box
มุมมอง 19K7 หลายเดือนก่อน
ACSS 101.01: Awesomeness Out of The Box
Build with ACSS: Zendesk.com Home Page (Part 6)
มุมมอง 2.1Kปีที่แล้ว
Build with ACSS: Zendesk.com Home Page (Part 6)
Build With ACSS: Zendesk.com Home Page Part 5
มุมมอง 2.3Kปีที่แล้ว
Build With ACSS: Zendesk.com Home Page Part 5
Build With ACSS: Zendesk.com Home Page Part 4 (Header Menus)
มุมมอง 3.8Kปีที่แล้ว
Build With ACSS: Zendesk.com Home Page Part 4 (Header Menus)
Build With ACSS: Zendesk.com Home Page (Part 3 - Synced Slider Section)
มุมมอง 3.5Kปีที่แล้ว
Build With ACSS: Zendesk.com Home Page (Part 3 - Synced Slider Section)
Build With ACSS: Zendesk.com Home Page (Part 2)
มุมมอง 5Kปีที่แล้ว
Build With ACSS: Zendesk.com Home Page (Part 2)
Build with ACSS: Zendesk.com Home Page (Part 1)
มุมมอง 16Kปีที่แล้ว
Build with ACSS: Zendesk.com Home Page (Part 1)
Frame Overview: Feature Romeo (Advanced Vertical Accordion)
มุมมอง 3.5Kปีที่แล้ว
Frame Overview: Feature Romeo (Advanced Vertical Accordion)
Component Overview: Accessible Accordion & Toggle
มุมมอง 3.2Kปีที่แล้ว
Component Overview: Accessible Accordion & Toggle
Component Overview: Frames Accessible Modal & Trigger
มุมมอง 3.9Kปีที่แล้ว
Component Overview: Frames Accessible Modal & Trigger
Mr. Geary, with respect, ACSS has been the very best product for me ever. I had planned to try to do everything you do in ACSS and found the huge amount of work it was. Thank you for this really great product and hope you will accept my acknowledgement for your being one of the best professionals I've ever encountered. Best wishes for you during this holiday season and may you have a tremendous and prosperous 2025.
“I’m not crying, YOU’RE crying!” Merry Christmas 🎁🎄 ❤
🎁🎁🎁
Thank you Kevin
Full of surprises! Love it!
Thank you Kevin, merry Christmas to you too
Sorry but it seems you forgot 'Freelancer' plan. At least you have to let the freelancer plan go up to 5 or 10, or just take it away from your whole offer.
No there still needs to be a smaller limited plan for many use cases.
Merry Christmas, Kevin.
I read the email title and thought it was goingto be a rug pull on the LTD limits, or something similar. Instead its the exact opposite. Its Christmas, forgive my scepticism. 😂 Merry Christmas to Geary & Co, plus Bev as well, Merry Christmas Bev! 🎄
I need a bundle 🙂 - Thank you - Merry Christmas
go kevin go, go kevin go, go kevin goooo, kevin be good.
Great news! I haven't bought ACSS yet, but surely will buy when I have money.
Merry Christmas/Fijn kerstfeest! 😄🎄 What a lovely present, thank you very much!
Merry Christmas
Amazing! Thank you Kevin and staff :)
Merry Christmas to you and yours all the way from Wales, UK! Thanks for the wonderful christmas present!!!
Merry Christmas Kevin to you and your family!
Amazing, well done and thank you Kevin! Here's hoping New Years surprise is Frames LTD Unlimited too lol
Merry Christmas to Kevin and and the ACSS/Frames team!
well done!
Wow, announcing such an incredible update on Christmas Day truly reflects how much you value the ACSS community! Removing site limits for agency and LTD plans is a fantastic decision that shows your commitment to empowering developers. Thank you for this thoughtful and generous change-it’s a game-changer for workflows. Wishing the ACSS team continued success in 2025 and beyond!
awesome! and btw the new lighting setup looks sick!
This is the same one just tweaked. New one will be unveiled soon!
❤
Merry Christmas everyone
🎉 Great news! Happy holidays 🌲
Merry Christmas Kevin & team!! 🎄🎁
What's great gift! Thank you 🙏🏼
Already had the unlimited license for ACSS.
OG!
You are a rockstar, Kevin. This was the best decision you and your team made in the journey of ACSS. We always support you and ACSS.
Think this could of waited
Ok
God bless you! 😊🙏🏻🙌🏻❤️🎉
Best Xmas present ever!! Thank you 🙏
❤
Well, now I'm officially all-in. I already had an Etch license, and now also bought an ACSS and Frames license (assuming that will go to unlimited sites as well ;-) ).
Hi, is Etch publicly available?
@@fawadalli Not at the moment. There has been a launch sale, and users that bought a license then have access to a sandbox environment where they can play with Etch. Right now, you can't buy a license for Etch, and you can't download it to use it on a real site either.
Thank you ACSS team!! Great job!!!
Merry Christmas to Kevin and the team for not only great products but for an amazing philosophy too!
Merry Christmas ACSS 🙂
Thank you, Kevin and the team! With a product this game-changing, positive word of mouth is inevitable. The chump life is officially behind me! Fantastic work, everyone, and wishing you all a very happy Christmas! 🎄
GREAT news Kevin! Merry Christmas! Making it easier for me to promote ACSS to other agencies.
This is an excellent value add to ACSS, good call.
Merry Christmas folks!
Thank you, in my mind it always feels like a hijacked ltd when it has limits, unlimited really shows passion
Merry Christmas! Love it thank you
Awesome Kevin! Merry Christmas to you, your family and your awesome team!
Amazing news, thanks. Slick cap.
Amazing Christmas gift! Thank you, Kevin!
Thanks Kevin, this is exciting news! Does this affect the licensing for Frames as well? Merry Christmas to all!
Not yet. We still have to look at the data there. We're starting with ACSS. If it makes sense for Frames, we'll do it there as well.
Hey Kevin - thanks for the video. Learned a ton! Is there a way to have a clean (straight) edge with Masonry layout (like the top). so it's like a perfect box look of the outer edges? Thank you...
I start with Bricks and when I see the possibilities of Automatic.css it makes me want to invest. Is a question about the interface multi-language?
Not yet. If you want to help us translate we can add this.
@@AutomaticCSS It would be with pleasure but I am not developer or webmaster and it may be difficult for me to translate the terms correctly. But I will still continue to visualize your tutorials on Automatic.Css, this framework which brings an innovation to Bricks.
I'm working on my third site with an overlay header, and I'm combining the techniques from your other video: How to Create a Simple Toggle-Based Overlay Header in Bricks Builder, and oh my! It's really all come together! What has also hit home for me is having the ACSS setting panel open at all times and controlling the entire site from here, which I've "sort of" been doing, in the past, but I've still been doing unnecessary custom CSS when I can control most of what I want from the panel. After completing PB 101 and building a solid foundation, then moving on to ACSS 101 and learning how the framework actually works, I feel much more confident to experiment and play around more. I am amped for new builds - thanks again for it all! Have a merry Christmas and all the best for 2025!
Glad to hear!
Brilliant software! I had no clue about this setup. I've just set up a new site like this. Can't wait!!!
Have fun!