alvaromontoro, 14 days ago

I made some slight changes to the toggle switch:

• Added a soft skew transform so it looks like the bear is leaning one way or the other
• Changed how the background is generated and added masks so the bear is visible in high-contrast mode (I haven't tested it though 😳)

https://codepen.io/alvaromontoro/pen/XWwrEKy

Showcase of a toggle button that looks like a bear looking from side to side (to the options "strange man" and "strange woman")

• x

  Image

  Upload file From url

  Image alternative text
• English-------------------AfarAbkhazianAchineseAcoliAdangmeAdygheAvestanTunisian ArabicAfrikaansAfrihiliAghemAinuAkanAkkadianAlabamaAleutGheg AlbanianSouthern AltaiአማርኛAragoneseOld EnglishOboloAngikaالعربيةAramaicMapucheAraonaArapahoAlgerian ArabicNajdi ArabicArawakMoroccan ArabicEgyptian Arabicঅসমীয়াAsuAmerican Sign LanguageAsturianAtikamekwAvaricKotavaAwadhiAymaraazərbaycanBashkirBaluchiBalineseBavarianBasaaBamunBatak TobaGhomalaбеларускаяBejaBembaBetawiBenaBafutBadagaбългарскиHaryanviWestern BalochiBhojpuriBislamaBikolBiniBanjarKomSiksikáAniiTai Dambamanakanবাংলাབོད་སྐད་BishnupriyaBakhtiaribrezhonegBrajBrahuiBodobosanskiAkooseBuriatBugineseBuluBlinMedumbacatalàCaddoCaribCayugaAtsamChakmaнохчийнCebuanoChigaChamorroChibchaChagataiChuukeseMariChinook JargonChoctawChipewyanCherokeeCheyenneChickasawCentral KurdishChilcotinCorsicanCopticCapiznonCreeMichifCrimean TatarSouthern East CreePlains CreeNorthern East CreeMoose CreeCarolina AlgonquianSeselwa Creole FrenchčeštinaKashubianSwampy CreeChurch SlavicчӑвашWoods CreeCymraegdanskDakotaDargwaTaitaDeutschDelawareSlaveDogribDinkaZarmaDogriLower SorbianCentral DusunDualaMiddle DutchDivehiJola-FonyiDyulaརྫོང་ཁDazagaEmbuEʋegbeEfikEmilianAncient EgyptianEkajukΕλληνικάElamiteMiddle EnglishEsperantoespañolCentral YupikeestieuskaraEwondoExtremaduranفارسیFangFantiPulaarsuomiFilipinoTornedalen FinnishFijianføroysktFonfrançaisCajun FrenchMiddle FrenchOld FrenchArpitanNorthern FrisianEastern FrisianFriulianFryskGaeilgeGaGagauzGan ChineseGayoGbayaZoroastrian DariGàidhligGeezGilbertesegalegoGilakiMiddle High GermanGuaraniOld High GermanGoan KonkaniGondiGorontaloGothicGreboAncient GreekSwiss GermanગુજરાતીWayuuFrafraGusiiGaelgGwichʼinHausaHaidaHakka ChineseHawaiianSouthern HaidaNorthern Haidaעבריתहिन्दीFiji HindiHiligaynonHittiteHmongHmong NjuaHiri MotuhrvatskiUpper SorbianXiang ChineseHaitian CreolemagyarHupaHalkomelemհայերենHererointerlinguaIbanIbibioIndonesiaInterlingueIgboꆈꌠꉙInupiaqEastern Canadian InuktitutWestern Canadian InuktitutIlokoIngushIdoíslenskaitalianoInuktitutIngrian日本語Jamaican Creole EnglishLojbanNgombaMachameJudeo-PersianJudeo-ArabicJutishJawaქართულიKara-KalpakKabyleKachinJjuKambaKawiKabardianKanembuTyapMakondeKabuverdianuKenyangKoroKongoKaingangKhasiKhotaneseKoyra ChiiniKhowarGikuyuKirmanjkiKuanyamaқазақ тіліKakokalaallisutKalenjinខ្មែរKimbunduಕನ್ನಡ한국어Komi-PermyakKonkaniKosraeanKpelleKanuriKarachay-BalkarKrioKinaray-aKarelianKurukhکٲشُرShambalaBafiaCologniankurdî (kurmancî)KumykKutenaiKomikernewekKwakʼwalaKuviкыргызчаLatinLadinoLangiWestern PanjabiLambaLëtzebuergeschLezghianLingua Franca NovaLugandaLimburgishLigurianLillooetLivonianLakotaLombardlingálaລາວMongoLouisiana CreoleLoziNorthern LuriSaamialietuviųLatgalianTshilubaLuba-LuluaLuisenoLundaLuoMizoLuyialatviešuLiterary ChineseLazMadureseMafaMagahiMaithiliMakasarMandingoMasaiMabaMokshaMandarMendeMeruMorisyenMalagasyMiddle IrishMakhuwa-MeettoMetaʼMarshalleseMāoriMi'kmawMinangkabauмакедонскиമലയാളംмонголManchuManipuriInnu-aimunMohawkMossiमराठीWestern MariMelayuMaltiMundangMuscogeeMirandeseMarwariMentawaiမြန်မာMyeneErzyaMazanderaniNauruMin Nan ChineseNeapolitanNamaNorwegian BokmålisiNdebeleLow GermanनेपालीNewariNdongaNiasNiueanAo NagaNederlandsKwasioNorwegian NynorskNgiemboonnorskNogaiOld NorseNovialN’KoSouth NdebeleNorthern SothoNuerNavajoClassical NewariNyanjaNyamweziNyankoleNyoroNzimaoccitanOjibwaNorthwestern OjibwaCentral OjibwaEastern OjibwaOji-CreeWestern OjibwaOkanaganOromooଓଡ଼ିଆиронOsageOttoman TurkishਪੰਜਾਬੀPangasinanPahlaviPampangaPapiamentoPalauanPicardNigerian PidginPennsylvania GermanPlautdietschOld PersianPalatine GermanPhoenicianPaliPijinpolskiPiedmontesePonticPohnpeianMaliseet-PassamaquoddyPrussianOld ProvençalپښتوportuguêsRunasimiKʼicheʼChimborazo Highland QuichuaRajasthaniRapanuiRarotonganRomagnolRohingyaRiffianrumantschIkirundiromânăRomboRomanyRotumanрусскийRusynRovianaAromanianKinyarwandaRwaसंस्कृत भाषाSandaweYakutSamaritan AramaicSamburuSasakSantaliSaurashtraNgambaySangusarduSicilianScotsسنڌيSassarese SardinianSouthern KurdishdavvisámegiellaSenecaSenaSeriSelkupKoyraboro SenniSängöOld IrishSamogitiansrpskohrvatskiTachelhitShanChadian ArabicසිංහලSidamoslovenčinaslovenščinaSouthern LushootseedLower SilesianSelayarSamoanSouthern SamiLule SamiInari SamiSkolt SamichiShonaSoninkeSoomaaliSogdienshqipсрпскиSranan TongoSererSwatiSahoSouthern SothoSaterland FrisianStraits SalishBasa SundaSukumaSusuSumeriansvenskaKiswahiliComorianClassical SyriacSyriacSilesianதமிழ்Southern TutchoneTuluతెలుగుTimneTesoTerenoTetumтоҷикӣTagishไทยTahltanትግርኛTigreTivtürkmen diliTokelauTsakhurTagalogKlingonTlingitTalyshTamashekTswanalea fakatongaNyasa TongaToki PonaTok PisinTürkçeTuroyoTarokoTorwaliTsongaTsakonianTsimshianтатарNorthern TutchoneMuslim TatTumbukaTuvaluTwiTasawaqTahitianTuvinianCentral Atlas TamazightUdmurtئۇيغۇرچەUgariticукраїнськаUmbunduاردوo‘zbekVaiVendaVenetianVepsTiếng ViệtWest FlemishMain-FranconianMakhuwaVolapükVoticVõroVunjoWalloonWalserWolayttaWarayWashoWarlpiriWolofWu ChineseKalmykIsiXhosaMingrelianKangriSogaYaoYapeseYangbenYembaייִדישÈdè YorùbáNheengatuCantoneseVahcuenghZapotecBlissymbolsZeelandicZenagaStandard Moroccan Tamazight中文isiZuluZuniZaza
• Add comment