Xeverything11 (talk | contribs)
Tag: Reverted
Xeverything11 (talk | contribs)
add official yt channel
 
(5 intermediate revisions by the same user not shown)
Line 1: Line 1:
<templatestyles src=":Main Page/styles.css" />
<templatestyles src=":skyHow/styles.css" />
__NOTOC__
__NOTOC__
<div class="main-page-header" style="font-size: 3rem; font-weight: 500; text-align: center; padding: 0.5rem;">Welcome to the <span style="border-radius: 4px; font-weight: bold; border-radius: 4px; background-image: linear-gradient(10deg, var(--color-primary-lighter1), var(--color-primary-lighter2)); padding: 0.2em;">free,&nbsp;open</span> how-to manual!</div>
<div class="main-page-header" style="font-size: 3rem; font-weight: 500; text-align: center; padding: 0.5rem;">A free, open how-to manual to <div class="tasks-group">
<div class="task-element task-cooking">
{{material icon|cooking|size=1.1em}}<span> cook</span></div>
<div class="task-element task-crafting">
{{material icon|draw_collage|size=1.1em}}<span> craft</span></div>
<div class="task-element task-solving">
{{material icon|troubleshoot|size=1.1em}}<span> solve</span></div>
<div class="task-element task-building">
{{material icon|construction|size=1.1em}}<span> build</span></div>
</div> anything!</div>


<div class="main-page-in-numbers" style="display: flex; text-align: center; flex-wrap: wrap;">
<div class="main-page-in-numbers" style="display: flex; text-align: center; flex-wrap: wrap;">
Line 59: Line 68:


See also: [[skyHow:Why skyHow?]]
See also: [[skyHow:Why skyHow?]]
== Follow us on ==
* [[File:YouTube full-color icon (2024).svg|32px]] [https://www.youtube.com/@skyHow-wiki Our official YouTube channel]


== skyHow in other languages ==
== skyHow in other languages ==
* [https://howtoes.wikioasis.org Spanish version]
* [https://howtoes.wikioasis.org Spanish version]


== Improved color palette! ==
[[es:skyHow]]
 
As you may have noticed, skyHow has implemented the new color palette, based on Tailwind v4. It takes advantage of OKLCH colors, which covers the P3 color gamut for supported devices, for brighter and punchier colors. It degrades gracefully to HEX colors in older browsers.
 
skyHow has also implemented these variables in error, warning, success, info and neutral types.
 
You can use the variables to set colors for text, backgrounds and borders.
 
{| class="wikitable"
! Lightness
! Error
! Warning
! Success
! Info
! Neutral (New!)
|-
| rowspan=2 | Lightest
| style="background: var(--color-error-lightest1);" |color-red-100
| style="background: var(--color-warning-lightest1);" |color-yellow-100
| style="background: var(--color-success-lightest1);" |color-green-100
| style="background: var(--color-info-lightest1);" |color-blue-100
| style="background: var(--color-neutral-lightest1);" |color-gray-50
|-
| style="background: var(--color-error-lightest2);" |color-rose-100
| style="background: var(--color-warning-lightest2);" |color-amber-100
| style="background: var(--color-success-lightest2);" |color-emerald-100
| style="background: var(--color-info-lightest2);" |color-indigo-100
| style="background: var(--color-neutral-lightest2);" |color-stone-50
|-
| rowspan=2 | Lighter
| style="background: var(--color-error-lighter1);" |color-red-300
| style="background: var(--color-warning-lighter1);" |color-yellow-300
| style="background: var(--color-success-lighter1);" |color-green-300
| style="background: var(--color-info-lighter1);" |color-blue-300
| style="background: var(--color-neutral-lighter1);" |color-gray-200
|-
| style="background: var(--color-error-lighter2);" |color-rose-300
| style="background: var(--color-warning-lighter2);" |color-amber-300
| style="background: var(--color-success-lighter2);" |color-emerald-300
| style="background: var(--color-info-lighter2);" |color-indigo-300
| style="background: var(--color-neutral-lighter2);" |color-stone-200
|-
| rowspan=2 | Light<br>''(Passes WCAG AA on dark backgrounds)''
| style="background: var(--color-error-light1);" |color-red-400
| style="background: var(--color-warning-light1);" |color-yellow-400
| style="background: var(--color-success-light1);" |color-green-400
| style="background: var(--color-info-light1);" |color-blue-400
| style="background: var(--color-neutral-light1);" |color-gray-400
|-
| style="background: var(--color-error-light2);" |color-rose-400
| style="background: var(--color-warning-light2);" |color-amber-400
| style="background: var(--color-success-light2);" |color-emerald-400
| style="background: var(--color-info-light2);" |color-indigo-400
| style="background: var(--color-neutral-light2);" |color-stone-400
|-
| rowspan=2 | Regular<br>''(Passes WCAG AA on light backgrounds)''
| style="color: var(--color-neutral-lightest1); background: var(--color-error1);" |color-red-600
| style="color: var(--color-neutral-lightest1); background: var(--color-warning1);" |color-yellow-700
| style="color: var(--color-neutral-lightest1); background: var(--color-success1);" |color-green-700
| style="color: var(--color-neutral-lightest1); background: var(--color-info1);" |color-blue-600
| style="color: var(--color-neutral-lightest1); background: var(--color-neutral1);" |color-gray-500
|-
| style="color: var(--color-neutral-lightest1); background: var(--color-error2);" |color-rose-600
| style="color: var(--color-neutral-lightest1); background: var(--color-warning2);" |color-amber-700
| style="color: var(--color-neutral-lightest1); background: var(--color-success2);" |color-emerald-700
| style="color: var(--color-neutral-lightest1); background: var(--color-info2);" |color-indigo-600
| style="color: var(--color-neutral-lightest1); background: var(--color-neutral2);" |color-stone-500
|-
| rowspan=2 | Dark
| style="color: var(--color-neutral-lightest1); background: var(--color-error-dark1);" |color-red-700
| style="color: var(--color-neutral-lightest1); background: var(--color-warning-dark1);" |color-yellow-800
| style="color: var(--color-neutral-lightest1); background: var(--color-success-dark1);" |color-green-800
| style="color: var(--color-neutral-lightest1); background: var(--color-info-dark1);" |color-blue-700
| style="color: var(--color-neutral-lightest1); background: var(--color-neutral-dark1);" |color-gray-600
|-
| style="color: var(--color-neutral-lightest1); background: var(--color-error-dark2);" |color-rose-700
| style="color: var(--color-neutral-lightest1); background: var(--color-warning-dark2);" |color-amber-800
| style="color: var(--color-neutral-lightest1); background: var(--color-success-dark2);" |color-emerald-800
| style="color: var(--color-neutral-lightest1); background: var(--color-info-dark2);" |color-indigo-700
| style="color: var(--color-neutral-lightest1); background: var(--color-neutral-dark2);" |color-stone-600
|-
| rowspan=2 | Darker
| style="color: var(--color-neutral-lightest1); background: var(--color-error-darker1);" |color-red-800
| style="color: var(--color-neutral-lightest1); background: var(--color-warning-darker1);" |color-yellow-900
| style="color: var(--color-neutral-lightest1); background: var(--color-success-darker1);" |color-green-900
| style="color: var(--color-neutral-lightest1); background: var(--color-info-darker1);" |color-blue-800
| style="color: var(--color-neutral-lightest1); background: var(--color-neutral-darker1);" |color-gray-800
|-
| style="color: var(--color-neutral-lightest1); background: var(--color-error-darker2);" |color-rose-800
| style="color: var(--color-neutral-lightest1); background: var(--color-warning-darker2);" |color-amber-900
| style="color: var(--color-neutral-lightest1); background: var(--color-success-darker2);" |color-emerald-900
| style="color: var(--color-neutral-lightest1); background: var(--color-info-darker2);" |color-indigo-800
| style="color: var(--color-neutral-lightest1); background: var(--color-neutral-darker2);" |color-stone-800
|-
| rowspan=2 | Darkest
| style="color: var(--color-neutral-lightest1); background: var(--color-error-darkest1);" |color-red-900
| style="color: var(--color-neutral-lightest1); background: var(--color-warning-darkest1);" |color-yellow-950
| style="color: var(--color-neutral-lightest1); background: var(--color-success-darkest1);" |color-green-950
| style="color: var(--color-neutral-lightest1); background: var(--color-info-darkest1);" |color-blue-900
| style="color: var(--color-neutral-lightest1); background: var(--color-neutral-darkest1);" |color-gray-950
|-
| style="color: var(--color-neutral-lightest1); background: var(--color-error-darkest2);" |color-rose-900
| style="color: var(--color-neutral-lightest1); background: var(--color-warning-darkest2);" |color-amber-950
| style="color: var(--color-neutral-lightest1); background: var(--color-success-darkest2);" |color-emerald-950
| style="color: var(--color-neutral-lightest1); background: var(--color-info-darkest2);" |color-indigo-900
| style="color: var(--color-neutral-lightest1); background: var(--color-neutral-darkest2);" |color-stone-950
|}
 
skyHow hopes that everyone will have a better experience when browsing skyHow.
 
Let us know if you have any questions.
 
[[User:Xeverything11|Xeverything11]] ([[User talk:Xeverything11|talk]]) 19:44, 3 May 2025 (UTC)

Latest revision as of 15:33, 27 June 2025

A free, open how-to manual to
cooking cook
draw_collage craft
troubleshoot solve
construction build
anything!

35
articles

1
quizzes

3,702
edits

25
users

Useful links: skyHow:Policy

Why skyHow over wikiHow?[edit | edit source]

Wiki skyHow wikiHow
MediaWiki version 1.43.3
Latest version, supported
1.33.0
Unsupported, obsolete version, 2019
Content license CC BY-SA 4.0
Free, reuse allowed even for commercial use
Non-free
Reuse prohibited outside wikiHow
Page creation Unregistered IPs and registered users Only autoconfirmed users
New pages available after creation Immediately
No quality review needed
Few days to several weeks
Available when approved via quality review
Ads? No Yes
for unregistered users
Quizzes? Yes
Editing allowed by all users
Yes
Editing restricted to admins only
Pricing Free
All content
Free
Paid for some features
Open source? Yes (mostly)
Except for fair use images
No (mostly)
Most content not open-source

See also: skyHow:Why skyHow?

Follow us on[edit | edit source]

skyHow in other languages[edit | edit source]