Stephanie Eckles

stylestage. A modern CSS showcase styled by community contributions. Add your stylesheet!

smolcss. Minimal snippets for modern CSS layouts and components

SupportsCSS. Live, in-browser detection of modern CSS support for selectors, features, and at-rules. Applies support-based classes, exposes a results object, and allows custom tests.

11ty-sass-skeleton. Featuring absolutely nothing beyond a base HTML5 template and the essential setup to watch and compile your Sass alongside 11ty.

11ty-netlify-jumpstart. Quickly launch an 11ty-generated static site. Includes a minimal Sass framework, generated sitemap, and RSS feed.

a11y-color-tokens. Generate accessible UI colors from your base color tokens.

moderncss-dot-dev. Posts from the series "Modern CSS Solutions to Old CSS Problems"

htmlrecipes. A collection of quick copy HTML snippets for a variety of common scenarios.

smol-11ty-starter. Extremely minimal Eleventy starter to kickstart a simple multi-page site / a nearly opinionless foundation to continue building on.

html-sass-jumpstart. Minimal Sass/HTML Template Site - dart sass powered, includes stylelint and prettier, and autoprefix upon build. develop script includes hot-reload via browsersync.

css-browser-support. Query for CSS brower support data, combined from caniuse and MDN, including version support started and global support percentages.

buttonbuddy. Learn about accessible button contrast then generate your own accessible button color palette

eleventy-rss-reader. Create a personal RSS Reader using Eleventy. Review recordings to learn how it was built!

11ty-email-generator. Generate simple, responsive email templates, with inlined CSS on build using 11ty.

11ty-web-component-generator. Use the power of 11ty to generate web components (custom elements).

eleventy-plugin-template. A starter environment for creating plugins for Eleventy (11ty).

eleventy-plugin-social-images. Create dynamic images sized for social media tags for your Eleventy content.

eleventy-plugin-lightningcss. Process CSS in Eleventy (11ty) with LightningCSS to minify, prefix, and add future CSS support.

eleventy-plugin-sass-lightningcss. Compile Sass in Eleventy (11ty) and process it with LightningCSS to minify, prefix, and add future CSS support.

11ty-twitch-scenes. A slim 11ty + Sass setup to get started creating custom Twitch scenes, including responding to chat commands with ComfyJS.

stylestage-sass. A starter for Style Stage submissions with the source Sass from the base theme + BrowserSync.

11ty-membership-site. An Eleventy theme for offering premium content to members. Requires Supabase and Netlify accounts.

nojson. It's a move considered revolutionary by many...

11ty-serverless-search. An example of using 11ty Serverless to. create site search using local and external data sources.

odb-generative-svg. A demonstration of returning a generative art SVG via Netlify On-Demand Builders

11ty-rocks. A collection of Eleventy (11ty) starters, projects, plugins, and resources created by Stephanie Eckles (@5t3ph)

gravity-forms-snippets. Applies bootstrap classes to various fields.

11ty-design-system-example. SCSS

howtowebdev. The source files repository for the video series for beginners to web development - "Learn How to Make a Website with Steph" - available on YouTube: https://www.youtube.com/channel/UC8qc2AyBbNmvgIky6236nHA

eleventy-plugin-emoji-readtime. Eleventy (11ty) plugin that provides a configurable filter to display an estimated read time for Eleventy content, optionally with an emoji visual indicator.

eleventy-plugin-collection-schemas. Enforce a typed frontmatter schema for templates within an Eleventy collection.

course-accessible-cross-browser-forms. Source code for the egghead course "Accessible Cross-Browser CSS Form Styling". Visit the link to take the course!

11ty-basics. A barebones demo of basic but essential 11ty features.

lwj-modern-css. Developed for Learn With Jason - a dashboard to showcase lots of modern CSS features!

11ty-css-houdini. An Eleventy environment for creating CSS Houdini Paint worklets.

course-grid-flexbox-landing-page. CSS

a11y-fails. Find the fails, submit a PR with fixes. See link for live demo.

repos-wrapped. A yearly review of your public GitHub repository stats.

eleventy-plugin-css-browser-support. Eleventy filters for decorating inline-code with CSS broswer support data or rendering support tables. Data combined from caniuse and MDN, including version support started and global support percentages.

eleventy-plugin-objectfit-focalpoint. JavaScript

11ty-edge-demo. Tiny demo with starter concepts for 11ty Edge.

tdbc. Stephanie Eckles' main site, built with Eleventy.

11ty-serverless-esbuild-test. JavaScript

howtowebdev-capstone. HTML

meow-vs-bowwow. An Eleventy starter as built for the following CSS-Tricks tutorial: https://css-tricks.com/a-community-driven-site-with-eleventy-building-the-site/

course-structure. A template to manage lessons for a related course using yarn workspaces.

pollmychat. A browser source Twitch poll widget created on-demand via the !poll chat command.

css-webring. A simple web component that retrieves a selection of CSS blog links with customization available via CSS variables.

11ty-demo-theme. Building live on Twitch! https://twitch.tv/5t3phDev

hydrate-me. Get hydrated by running this solo or appending to a watch type of command for reminders at your chosen minute interval.

houdini-decorative-barcharts. JavaScript

popular-named-css-colors. A compilation of replies to a silly tweet asking about named CSS colors.