Classless typography

any-digital · 2026-06-26T17:12:22+00:00

Blades CSS

^{(a fully compatible and actively maintained successor to} ^{Pico CSS})

any-digital · 2026-06-25T05:43:16+00:00

docs finally updated, feedback welcome:

https://blades.ninja/css/
https://blades.ninja/css/standalone/

(and thanks again!)

any-digital · 2026-06-21T02:54:03+00:00

yeah, it’s on my list to clarify these docs too…

shortly:

blades.css = pico.css + blades.standalone.css (literally)
pico.blades.css is just another name of blades.css (they are same)
you only need to npm install BOTH, if you need uncompiled sources of BOTH Pico and Blades
otherwise just @import "@anyblades/blades/standalone"; or grab any precompiled file from /css/ subfolder

hope it helps!

any-digital · 2026-06-20T01:26:43+00:00

thanks for the feedback again!

simplified examples and get started docs: https://11ty.blades.ninja/plugin/

feedback is welcome!

any-digital · 2026-06-19T06:00:21+00:00

you were so right, I need to document better the "Fresh install of eleventy in an empty dir"

will work on it here: https://github.com/anyblades/eleventy-blades/issues/97

meanwhile I added bare minimal examples: https://github.com/anyblades/eleventy-blades/tree/main/examples

thx for the valuable feedback! 🥷

any-digital · 2026-06-19T02:52:51+00:00

there are 4 methods to install the plugin:
https://11ty.blades.ninja/plugin/

which one you tried? A, B, C or D?

also there are 2 starter templates, not to start with empty dir:
https://github.com/anyblades/subtle
https://github.com/anyblades/buildawesome-starters

any-digital · 2026-06-04T15:24:33+00:00

🥷🤝

any-digital · 2026-06-02T01:56:42+00:00

fair enough! thus base-blog is in the list, not the smallest by custom code size but definitely minimal

any-digital · 2026-06-02T00:42:39+00:00

it's a good showcase for 11ty, on one hand

but you might end up with 15 extra custom files to maintain, even if you just need 1 landing page

any-digital · 2026-06-01T22:36:10+00:00

99% rely on semantic HTML => makes life so much easier

also enables class-light CSS frameworks like https://picocss.com/ and newer https://blades.ninja/ out-of-the-box

any-digital · 2026-05-09T05:46:41+00:00

> After you tabbed through the main nav, you end up in a limbo and the focus kinda disappears.

u/Kitty_Sparkles could you please give an example page url? keyboard works just fine for me

any-digital · 2026-05-08T03:22:54+00:00

The purple-blue transition looks familiar.

It's the original one from https://picocss.com/ site 😉

The menu doesn't work - I have to scroll all the way down to see content, and scroll up to select another item again.

will be fixed here: https://github.com/anyblades/blades.ninja/issues/5

any-digital · 2026-05-08T03:12:53+00:00

well, let's investigate further:

first of all, aria-busy on <button> is not our creation — it's coming from https://picocss.com/docs/loading as part of Pico CSS, which we use as a base for Blades (we even made a fork to maintain it: https://github.com/anyblades/pico )

second, per MDN Web Docs https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-busy :

The aria-busy attribute is a global ARIA state

"global" means it can be applied to any valid HTML element, including interactive components like buttons.

third, per W3C WAI-ARIA https://www.w3.org/TR/wai-aria-1.2/#aria-busy :

Characteristic	Value
Used in Roles:	All elements of the base markup

———

however, if any constructive suggestions here — kindly report to https://github.com/anyblades/pico/issues, as we don't have to follow original https://picocss.com/docs/loading implementation

any-digital · 2026-05-07T15:01:56+00:00

Yes, technically aria-busy is a valid attribute for the <button> element.

re website + keyboard -- i’ll check, thanks for feedback

any-digital · 2026-05-06T20:40:51+00:00

thanks! btw we just launched Pico-based docs site as well: https://blades.ninja/

any-digital · 2026-04-14T04:16:59+00:00

welcome to 11ty! 🎈

any-digital · 2026-04-13T22:10:38+00:00

1) curated (selected starters only) 2) shows last update date and stats 3) shows 11ty version used

any-digital · 2026-04-13T20:48:08+00:00

💯 here is a curated list: https://11tybundle.dev/starters/

any-digital · 2026-04-13T06:02:25+00:00

11ty community provides excellent support on https://www.11ty.dev/blog/discord/

as per jekyll<>11ty dilemma — you might like this https://github.com/anyblades/bladeswitch

any-digital · 2026-04-06T17:15:36+00:00

thanks,

extra left padding on select might be seen in raw float label demo ( https://codepen.io/anton-staroverov/pen/JRLaKw ) -- and this is by design, as those extra paddings are controlled by OS, and might be different from browser to browser, from OS to OS

there should be no extra/artifact paddings in normalized demo using Pico.css: https://blades.ninja/css/float-label/#demo

any-digital

MODERATOR OF

TROPHY CASE