Typografi & Mattenheter

Den här sidan erbjuder två kostnadsfria verktyg för att organisera typografi och gränssnittsmått. Typskala bygger en storleksskala från ett förhållande, och Pixels och REM konverterar pixlar och rem med en vald bas. De hjälper designers och utvecklare att sätta en texthierarki och översätta värden mellan enheter. Båda verktygen kräver ingen registrering och behåller ditt arbete i webbläsaren.

Börja med Typskala om du behöver en progression av storlekar, till exempel för rubriker och stycken. Använd Pixels och REM när du redan har värden att konvertera eller vill kontrollera en bas. De två verktygen fungerar bra tillsammans: skalan sätter stegen, sedan hjälper konverteringen till att uttrycka dem i rem. De är gratis och kräver ingen registrering.

Så använder du

  1. Börja med Typskalning för att ställa in en progression av storlekar och välj ett förhållande som passar din texthierarki.
  2. Notera värdena du får, använd sedan Pixels och REM för att omvandla dem till rem med din projektbas.
  3. Kontrollera slutligen att rubriker, underrubriker och brödtext förblir läsbara och konsekventa över flera skärmbredder.
  4. Kontrollera omvandlingarna en sista gång med Pixels och REM på en liten och en stor skärm, justera sedan basen eller stegen om texten känns för trång.

Vanliga frågor

Varför använda en typskala?

Typskala bygger en storleksskala från ett förhållande. Den hjälper till att hålla en konsekvent hierarki mellan rubriker, underrubriker och brödtext. Verktyget är gratis och kräver ingen registrering.

Vilken bas ska jag välja för Pixels och REM?

Pixels och REM konverterar med en vald bas. Basen är den referensstorlek du använder i ditt projekt. Kontrollera det startvärdet före konvertering.

Fungerar de två verktygen tillsammans?

Ja. Typskala definierar stegen, sedan kan Pixels och REM konvertera de resulterande värdena. Detta håller en läsbar progression och lämpliga enheter. Båda är gratis, kräver ingen registrering och stannar i webbläsaren.

Hur tillämpar jag en skala och omvandlar sedan till rem?

Definiera stegen först med Typskalning. Notera storlekarna du vill ha, öppna sedan Pixels och REM för att omvandla dessa värden med den valda basen. Kontrollera resultatet i din stilmall för att behålla en regelbunden hierarki.

Vad bör jag kontrollera innan jag väljer ett förhållande i Typskalning?

Titta på skillnaden mellan den minsta och största planerade texten. Ett starkt förhållande kan skapa luckor som är svåra att använda, medan ett svagt förhållande gör hierarkin mindre tydlig. Testa sedan stegen med Pixels och REM för att uttrycka dem i dina enheter.

Verktyg i samma kategori