theme.css

@import url('https://fonts.googleapis.com/css2?family=DynaPuff:wght@400;500;600;700&family=Nunito:wght@300;400;500;600;700&family=Open+Sans:wght@300;400;500;600;700&display=swap');

/* font-family: 'DynaPuff', cursive;
font-family: 'Nunito', sans-serif;
font-family: 'Open Sans', sans-serif; */

:root{
    --mavi1:hsl(205,90%,30%);
    --mavi2:hsl(205,90%,40%);
    --mavi3:hsl(205,90%,50%);
    --mavi4:hsl(205,90%,60%);
    --mavi5:hsl(205,90%,70%);


    --mavi1:hsl(205,98%,30%);
    --mavi1:hsl(206,97%,30%);
    --mavi1:hsl(207,96%,30%);
    
    
  /* Basliklar icin kullanilan koyu tonlar */
  --gri-1: hsl(209, 61%, 16%);
  --gri-2: hsl(211, 39%, 23%);
  --gri-3: hsl(209, 34%, 30%);
  --gri-4: hsl(209, 28%, 39%);

  /* Paragraflar icin kullanilan renkler */
  --gri-5: hsl(210, 22%, 49%);
  --gri-6: hsl(209, 23%, 60%);
  --gri-7: hsl(211, 27%, 70%);
  --gri-8: hsl(210, 31%, 80%);
  --gri-9: hsl(212, 33%, 89%);
  --gri-10: hsl(210, 36%, 96%);

  --mor: hsl(276, 85%, 49%);

  --beyaz: #fff;
  --koyu-kirmizi: hsl(360, 67%, 44%);
  --acik-kirmizi: hsl(360, 71%, 66%);
  --koyu-yesil: hsl(125, 67%, 44%);
  --acik-yesil: hsl(125, 71%, 66%);
  --siyah: #222;


  --mavi1: hsl(205, 100%, 30%);
  --mavi2: hsl(205, 100%, 40%);
  --mavi3: hsl(205, 100%, 50%);
  --mavi4: hsl(205, 100%, 60%);
  --mavi5: hsl(205, 100%, 70%);

  /* asil renklerin acik tonları */
  --mavi-6: hsl(205, 89%, 70%);
  --mavi-7: hsl(205, 90%, 76%);
  --mavi-8: hsl(205, 86%, 81%);
  --mavi-9: hsl(205, 90%, 88%);
  --mavi-10: hsl(205, 100%, 96%);
  --mavi-11: hsl(205, 3%, 95%);
        /* Fonts */
  --ff-dyna: 'DynaPuff', cursive;
  --ff-nunito: 'Nunito', sans-serif;
  --ff-open-sans: 'Open Sans', sans-serif;
        /* shadow */

  --koyu-golge: 0px 0px 15px rgba(0, 0, 0, 0.4);
  --acik-golge: 0px 5px 15px rgba(0, 0, 0, 0.1);
}